写博客要配封面图常见的两条路都不太顺网上找图有版权风险用设计工具则要装软件、调半天版式。还有第三条路——把封面当成一个网页来排版再让无头 Chrome 截成 PNG。为什么值得这么做排版完全可控。封面就是一张固定尺寸的画布标题在哪、多大字号、什么渐变都能用 CSS 精确指定不用跟图形界面较劲。字体走系统。中文直接用系统里的微软雅黑或宋体不依赖任何在线字体服务断网也能跑。没有版权问题。图是自己渲染出来的不存在这图是从哪找的。可复现。同一段 HTML 任何时候重跑都得到同一张图改文案只需要改一行。三步跑通1. 写封面 HTML。关键是画布尺寸要和后面截图的参数一致!doctypehtmlhtmlheadmetacharsetutf-8stylehtml,body{margin:0;width:1200px;height:800px}body{background:linear-gradient(135deg,#0f2027,#203a43,#2c5364);color:#fff;font-family:Microsoft YaHei,sans-serif;display:flex;flex-direction:column;justify-content:center;padding:80px;box-sizing:border-box}h1{font-size:76px;margin:0 0 24px;line-height:1.15}p{font-size:32px;opacity:.85;margin:0}/style/headbodyh1文章标题/h1p一句话副标题/p/body/html2. 渲染成 PNG。--window-size必须和 CSS 里的画布尺寸对上chrome--headless--disable-gpu --no-sandbox --hide-scrollbars\--screenshotcover.png --window-size1200,800cover.html看到NNN bytes written to file就是成功了。3. 校验产物。确认尺寸对、中文没变成方框python3-cfrom PIL import Image; imImage.open(cover.png); print(im.size, im.mode)三个容易踩的坑坑现象怎么办画布尺寸与--window-size不一致图被裁掉一块或四周多出留白两处都写 1200×800改尺寸时同步改系统缺中文字体中文全渲染成方框先fc-list :langzh | wc -l为 0 就先装好中文字体再fc-cache -f刷出一片 dbus / UPower 报错以为渲染失败无桌面环境的正常噪音只看有没有bytes written to file什么时候适合用封面、文章头图、简单示意图这类文字为主、版式规整的图这条路线几分钟就能出图改一版也就改一行 CSS。反过来需要照片质感、复杂插画或精细数据可视化的场合它不是合适的工具——那些要么交给专业设计软件要么用专门的绘图库。一句话把封面当成网页来排版渲染交给浏览器剩下的工作就只剩调 CSS。