text-indent 应全局用 p { text-indent: 2em; } 统一控制，避免内联样式、类名或 ；禁用 padding-left 代替；Flex 容器中需设 display: block 确保生效。
text-indent 一行够用，别套 class 或内联 style
直接写 p { text-indent: 2em; } 就能全局生效，比每个 <p class="indent"> 或 <p style="text-indent: 2em"> 省下大量重复代码。类名和内联样式只在需要差异化控制时才有意义——比如引用段落要反向缩进、标题不缩进、首段例外等。纯正文统一缩进，CSS 规则越少，维护成本越低，浏览器解析也越快。
别用 或多个空格模拟缩进
写 这里是段落 看似省事，但问题一堆：
- 复制粘贴时容易丢空格或转成普通空格，缩进消失
- 屏幕阅读器会把 当作可读字符朗读，影响无障碍体验
- 换字体、改字号、切响应式断点后，视觉缩进量完全不可控
- HTML 源码里混入语义无关的空白符，污染结构
它不是“精简”，是偷懒埋雷。
避免 padding-left 代替 text-indent
用 p { padding-left: 2em; } 看起来也缩了，但本质不同：
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
立即学习“前端免费学习笔记（深入）”；
-
padding-left推动整块<p>，第二行也会离左边界 2em，破坏中文段落规范 - 缩进值不随字体大小自适应（除非用 em，但逻辑错位）
- 和栅格系统、flex 容器容易冲突，尤其
justify-content: center下会偏移失准 - 若段落带背景色或边框，padding 产生的空白会显形，text-indent 不会
Flex/Grid 里缩进失效？先确认 display 类型
如果 p 在 display: flex 容器里没缩进，不是 text-indent 失效，而是 p 默认变成 flex item，脱离了块级格式化上下文。解决方式很直接：
- 给
p显式设display: block（推荐） - 或者用
margin-left替代（仅当真需整体右移） - 别指望靠父容器加
text-align: justify带出缩进——它不自动触发text-indent
最稳的验证方式：打开开发者工具 → 查 Computed → 确认 display 是 block，且 text-indent 最终值非零。缩进看似简单，真正卡住人的永远是渲染上下文那层隐性规则。
