text-indent是唯一语义正确、兼容性最稳的首行缩进方案；它仅作用于块级元素首行，而padding-left/margin-left会整体偏移段落，破坏对齐与响应式。

text-indent 是唯一语义正确、浏览器兼容性最稳的首行缩进方案；别用 padding-left 或 margin-left 伪装缩进——它们改的是整个块的位置，不是排版意义上的“首行空两格”。

为什么 text-indent: 2em 有时完全没反应

不是 CSS 写错了，而是渲染前提没满足：

• 被设成 display: inline 或 inline-block —— 浏览器不生成“首行盒”，text-indent 直接被忽略
• 父容器用了 display: flex 或 display: grid，
  的块级格式化上下文被覆盖
• 段落开头是 、 等内联替换元素，缩进作用在该元素左侧，视觉上等于没动
• 某处写了 p { text-indent: 0 !important; }（富文本编辑器输出里极常见）
• white-space: nowrap 或 white-space: pre 禁用了换行，“首行”概念失效

最快验证方式：打开开发者工具 → 查看目标

HTML Text Extract

从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

下载

的 Computed 面板 → 确认 display 是 block，且 text-indent 最终值不是 0。

text-indent 单位怎么选才靠谱

单位选错，缩进就“看起来不对”，尤其在响应式或系统字体放大的场景下：

• 2em：最稳妥。1em ≈ 当前 font-size，缩进随字号放大/缩小，中文下视觉接近两字符宽度
• 2ch：语义更准（1ch ≈ 字符 “0” 宽度），但 IE 不支持，且多数中文字体里 1ch 远小于一个汉字
• 32px 或 20px：仅限字体大小绝对固定的静态页；系统缩放、DPI 变化时会失准
• 2%：按父容器宽度计算，和字体无关——窄屏下缩进可能只剩几像素，完全不够
• 2rem：若项目用 JS 动态改 html { font-size }（如夜间模式），缩进会意外跳变

别用负值或百分比兼容 IE8；它对 text-indent: -1em 和 text-indent: 5% 支持极不稳定，尤其配合 direction: rtl 时容易错位。

表格单元格（）里 text-indent 失效怎么办

因为 默认是 display: table-cell，它不生成标准的“首行盒”，text-indent 就容易失效，尤其内容短、未换行时。

• 最稳妥的替代方案：td, th { padding-left: 2em; } —— 不依赖行盒，所有浏览器都认
• 若必须保留首行缩进语义（比如导出 PDF 需匹配印刷规范），用包裹
  ：

  内容
• 调试时加 background: #ff0 到 ，看文字是否真偏移；如果背景框里文字还贴左，说明 text-indent 没触发，立刻切到 padding-left

  统一缩进但要排除某些段落（比如标题、引用、首段）

  全局设 p { text-indent: 2em; } 很方便，但实际排版中常需例外处理：

  • 首段不缩进：.content p:first-child { text-indent: 0; }
  • 引用段落反向缩进：blockquote p { text-indent: -1em; padding-left: 1em; }（负缩进 + 左内边距防文字溢出）
  • 标题类段落（如
    ）：p.title { text-indent: 0; font-weight: bold; }
  • 避免用 :not() 写复杂选择器，CSS 优先级易失控；宁可显式加类、再单独重置

  真正难的不是写对那行 text-indent: 2em，而是确认它在所有上下文里都按预期工作：表格里、Flex 容器里、富文本输出的 HTML 里、打印预览里……每个环境都可能悄悄绕过这个属性。动手前先打开开发者工具，盯着 Computed 面板看 text-indent 是否被计算、是否被覆盖、是否生成了 line box —— 这比反复试数值管用得多。