不能用<p align="center">，因align属性在HTML5中已废弃，会导致校验失败、语义错误且不支持justify或逻辑值，在RTL语言下破坏阅读流；应使用text-align: center作用于<p>自身。
直接用 text-align 控制段落对齐，别碰 align 属性——它在 HTML5 中已废弃，现代浏览器虽可能兼容，但校验失败、语义错误、响应式布局中容易失效。
为什么不能用 p align="center"
这个写法看着简单，但实际埋了三个坑：
-
align是 HTML4 时代的内联属性，HTML5 标准里已被移除，W3C 验证器会报错 - 它只支持
left/center/right，不支持justify或逻辑值start/end，多语言场景直接卡死 - 当父容器设置了
direction: rtl（如阿拉伯语），align="left"会强制锚定物理左侧，破坏阅读流；而text-align: start会自动适配起始边
text-align 的四种常用值怎么选
所有值都作用于段落内部的行内内容（文字、图片、span 等），不影响 p 自身位置：
-
text-align: left：默认值，适合常规正文，从左到右语言下即物理左对齐 -
text-align: center：标题、按钮文字、短提示语适用；长段落慎用，易降低可读性 -
text-align: right：数字金额、时间戳、右向语言（如希伯来语）内容 -
text-align: justify：报纸/杂志类排版可用，但注意最后一行不会拉伸，且中文两端对齐效果一般，常需配合text-justify: inter-ideograph（仅部分浏览器支持）
怎样避免样式污染和继承混乱
常见错误是把 text-align 写在 body 或大容器上，结果所有子段落、列表项、按钮文字全被强行对齐：
立即学习“前端免费学习笔记（深入）”；
- 优先用类名控制：
<p class="article-body">…</p>，再写.article-body { text-align: justify; } - 若需局部覆盖，用更具体的选择器，比如
article .caption { text-align: center; }，而不是靠!important - 遇到内联元素（如
img）不随text-align居中？那是块级化问题，加display: block; margin: 0 auto;才真正居中
响应式中对齐方式要动态切换吗
一般不需要。但有两个真实场景值得加媒体查询：
- 小屏设备上禁用
justify：窄 viewport 下两端对齐会产生过大字间距，改用text-align: left - 横屏表格页中让数字列右对齐：
@media (min-width: 768px) { .numeric-col { text-align: right; } }
复杂点在于：对齐不是孤立属性，它和 direction、unicode-bidi、字体度量都有关联；中文段落用 justify 时，不同浏览器渲染差异明显，上线前务必真机测试。
