::first-line伪元素不能实现首行缩进，因其不支持text-indent等缩进属性；正确做法是直接对块级段落元素（如p）设置text-indent。
段落首行缩进不能用 ::first-line 伪元素实现——它不接受 text-indent，也不支持设置缩进量。
为什么 ::first-line 不能用来做首行缩进
::first-line 仅能控制首行的字体、颜色、背景等继承性样式，text-indent 被明确列为「不生效属性」。浏览器会忽略对它的设置，且无任何警告。
- 常见错误写法：
div::first-line { text-indent: 2em; }→ 完全无效 - 即使加上
!important或换用margin-left，也无法让首行“向内缩” -
::first-line的作用范围是「首行中所有可渲染文本内容」，不是「首字符前的空白区域」
正确做法：直接用 text-indent 设置段落
标准、兼容、语义清晰的方式就是给 p 或其他段落容器设 text-indent：
p {
text-indent: 2em;
}
-
2em是中文排版常用值（约两个汉字宽度），也可用1em、20px等 - 该属性只影响第一行开头，后续行不受影响
- 若想取消首段缩进（如文章标题后第一段），可单独加类：
.no-indent { text-indent: 0; }
需要兼容 IE8 或处理 inline 元素时的注意点
老版本 IE 对 text-indent 在某些 inline 上表现异常，但只要作用在块级元素（p、div、section）上就完全可靠。
立即学习“前端免费学习笔记（深入）”；
- 避免写成：
span { text-indent: 2em; }→ 大概率不生效，因为span默认是 inline - 如果容器是
display: inline-block或flex，text-indent也会失效 - 确保目标元素有明确的
width或处于正常文档流中，否则缩进可能被裁剪或错位
真正要小心的是「误以为 ::first-line 可控缩进」这个认知偏差——它常出现在搜索“首行缩进 css 伪类”这类关键词时的误导结果。实际排版中，text-indent 就是唯一该用的属性。
