text-indent与text-align:center不能共用，因居中会重算内容盒位置导致缩进基准丢失；正确做法是外层容器控制居中、内层p仅设text-indent:2em。
text-indent 实现首行缩进，配合 text-align: center 或 margin: 0 auto 实现居中——但二者不能直接共用在同一个块级元素上，否则会互相破坏效果。
为什么 text-indent 和 text-align: center 一起用会失效
给 <p></p> 同时设 text-align: center 和 text-indent: 2em，首行缩进大概率消失。这不是 bug，而是渲染逻辑冲突：
-
text-align: center要求整段文字水平居中，浏览器会把内容盒（content box）整体居中对齐，此时“首行”起点被重算，text-indent的偏移基准丢失 - 缩进值仍存在（开发者工具里
Computed → text-indent显示 2em），但视觉上被居中逻辑覆盖，表现为“没动” - 若段落只有一行，
text-align: center会让整行居中，text-indent在视觉上完全不可见
想居中又想首行缩进，该怎么做
必须拆开职责：居中由容器控制，缩进由段落自身控制。常见且可靠的组合方式如下：
- 外层
<div> 设 <code>text-align: center或margin: 0 auto+width控制整体水平位置 - 内层
<p></p>保持默认display: block，只加text-indent: 2em，不设text-align - 若需多段文字整体居中，推荐用
max-width: 600px; margin: 0 auto;包裹整个文章区域，再对其中每个p单独设text-indent - 避免对
p自身设text-align: center—— 那是标题、按钮或短语的排版需求，不是段落缩进场景 - 整段左移，后续行也跟着偏，破坏
text-align: justify对齐逻辑 - 复制粘贴时，缩进变成真实空白字符（尤其当 padding 含空格或伪元素时）
- 响应式下，固定
padding-left: 32px在小屏可能溢出容器；而text-indent: 2em随字体缩放，始终接近两个汉字宽度 - 屏幕阅读器能正确跳过
text-indent，但会把padding-left当作内容留白误读 -
p:first-of-type { text-indent: 0; }—— 适合结构清晰、p总是第一个子元素的页面 -
p.no-indent { text-indent: 0 !important; }—— 更灵活，CMS 或 Markdown 渲染时可自动加类 - 慎用
p:nth-of-type(1)：如果前面有<h2></h2>或<div>，它可能选错目标 <li>若富文本编辑器输出的 <code>p带内联style="text-indent: 2em"，可用p[style] { text-indent: 2em !important; }强制统一，但仅限兜底
text-indent: 2em 为什么比 padding-left 更合适
有人图省事给 p 加 padding-left: 2em 来“模拟”缩进，这会导致：
第一段不缩进怎么处理
导语、引言、标题后第一段通常不缩进。不要靠删 class 或手动覆盖，用 CSS 主动排除更稳：
真正容易被忽略的是：居中和缩进从来就不是同一层级的排版任务。居中解决的是“容器内位置”，缩进解决的是“段落内部节奏”。混在一起强行塞进一个标签，十次有九次要调半天 computed styles 才发现问题不在代码，而在语义分工错了。
