:lang(zh) 生效需 html 显式声明 lang="zh",weasyprint 严格解析且不支持子标签如 zh-cn;行高应使用无单位值(如 1.8),配合中文字体、字间距及避免 line-height: normal。

:lang(zh) 能生效,但必须配合正确的 HTML lang 属性,且行高设置需避开常见继承陷阱。
确保 lang="zh" 正确写在 HTML 元素上
浏览器只认显式声明的 lang 属性,不会自动推断语言。没有这个属性,:lang(zh) 完全不匹配。
- ✅ 正确:
<p lang="zh">中文段落</p>或 - ❌ 无效:
<p>中文段落</p>(无lang)、<p lang="zh-CN"></p>(部分旧版 WeasyPrint 不识别子标签,优先用zh) - ⚠️ 注意:WeasyPrint 对
lang的解析比浏览器更严格,zh-Hans或zh-TW可能不触发:lang(zh),除非你显式写成:lang(zh-Hans)
:lang(zh) { line-height: 1.8; } 为什么有时没效果?
根本原因不是选择器失效,而是 line-height 的继承和层叠行为被误判。
- 如果父元素设了
line-height: 1.2,而:lang(zh)写在更外层(比如body),它可能被内层更具体的规则覆盖 -
line-height的计算值会继承,但「无单位数值」(如1.8)是相对当前元素font-size计算的——若中文文本用了不同字体或字号,实际行高会偏移 - WeasyPrint 中,
line-height若设为px值(如24px),在多字号混排时容易撑开或挤压,推荐始终用无单位数值
中文字体 + 行高 + 字间距要一起调
单设 line-height 不够,中文阅读舒适度还依赖字间距和字体堆栈。WeasyPrint 渲染中文字体时尤其敏感。
- 中文建议最小
line-height: 1.6,常用1.7–1.8;英文段落保持1.4–1.5即可 - 搭配
letter-spacing: 0.02em可缓解汉字拥挤感(注意:不能设负值,WeasyPrint 不支持) - 务必指定中文字体,例如:
:lang(zh) { font-family: "Noto Sans CJK SC", "Source Han Sans CN", sans-serif; } - 避免用
font-size差异过大的混排——:lang(zh)规则里的line-height是按自身font-size算的,不是父级的
WeasyPrint 中 :lang(zh) 的兼容性雷区
不是所有 CSS 特性都能在 WeasyPrint 里跑通,尤其是涉及语言检测的渲染流程。
-
:lang(zh) ::before插入中文引号(如content: "“";)可行,但content: open-quote依赖quotes属性,WeasyPrint 目前不支持动态引号对 -
text-align: justify在:lang(zh)下表现不稳定,建议改用text-align: start - 若 PDF 输出中行高忽大忽小,大概率是某处用了
line-height: normal—— WeasyPrint 的normal计算逻辑和浏览器不同,直接替换为1.5类数值更可靠
真正起效的关键不在选择器写得多漂亮,而在 HTML 的 lang 是否真实存在、字体是否加载成功、以及 line-height 是否脱离了父级干扰。WeasyPrint 不会帮你猜语言,也不会宽容缺失的字体回退路径。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











