推荐使用 text-indent: 2em，因1em≈当前字体下一个汉字宽度，响应式友好且兼容性佳；慎用2ch，因其依赖“0”字宽，在比例字体中常不等于汉字宽。
text-indent 的单位选择直接影响“两字符”是否准确
直接写 text-indent: 2ch 看似合理，但 ch 单位基于当前字体的 “0” 字符宽度，不是汉字宽度。中文字体里，“0” 和 “字” 宽度常不一致（尤其等宽 vs 非等宽字体），所以 2ch 在多数场景下 ≠ 两个汉字缩进。
更可靠的做法是用 em：1em ≈ 当前字号下该字体一个汉字的平均宽度（浏览器对中文字体的 em 实现普遍贴近实际字宽）。因此：
-
text-indent: 2em是实现“首行缩进两字符”的通用解法 - 若字号为
16px，则缩进约32px；字号变为20px，自动变为40px，响应式友好 - 避免用
px（如32px），否则字号变化时缩进失效
text-indent 不生效？检查这些常见前提
text-indent 只对块级元素（display: block 或 inline-block）生效，且要求内容为纯文本或内联子元素。以下情况会“看起来没效果”：
- 父容器设置了
white-space: nowrap，导致换行被抑制，首行概念消失 - 元素是
inline元素（如span），需先设display: block - 文本第一行被
br或空格/换行符提前截断，实际缩进发生在第二行 - CSS 优先级被其他规则覆盖（如更高权重的
text-indent: 0）
遇到中文标点悬挂或排版错位怎么办
单纯 text-indent: 2em 在遇到中文顿号、句号、引号等结尾标点时，可能因字体渲染细节导致视觉错位。这不是 text-indent 的问题，而是排版引擎对全角字符边距的处理差异。
若需精细控制（如出版级排版），可配合：
-
text-align: justify提升段落对齐一致性（但注意两端对齐在短行易产生过大词间距） - 禁用
line-height过小值（如line-height: 1），避免基线挤压影响缩进感知 - 不用
letter-spacing或word-spacing干扰默认字距
Flex/Grid 容器里的 text-indent 行为异常
当 p 或 div 被嵌套在 display: flex 或 display: grid 的父容器中时，text-indent 仍生效，但若子元素被设为 align-self: flex-start 或存在 margin 干扰，缩进可能被视觉掩盖。
验证方式：临时加一条 border: 1px solid red 到文本容器，看缩进是否真实发生——很多时候只是父容器 padding/margin 让它“看不见”，而非没生效。
真正容易被忽略的是：缩进值会受 font-family 切换影响。比如从 "PingFang SC" 换成 "Noto Sans CJK"，相同 2em 下汉字实际宽度可能浮动 ±5%，需要实测微调。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
