text-align 是唯一能直接用在 html 标签上且被现代浏览器支持的对齐属性，但仅作用于块级容器内的行内级内容（如文字、img、span），对块级子元素无效；html5 已废弃 align 属性，须用 css 替代。
text-align 是唯一能直接用在 HTML 标签上、且仍被现代浏览器支持的对齐属性，但它只作用于行内内容，不是“让整个标签挪位置”。
为什么 align 属性失效了
HTML4 里常见的 <p align="center"></p> 或 <div align="right"> 已被 HTML5 废弃。浏览器可能还能渲染，但行为不可靠——比如在某些 Safari 版本中完全忽略，或在表格嵌套时错乱。W3C 明确要求用 CSS 替代。
<ul>
<li>废弃原因：语义和样式混杂，不利于维护与响应式适配</li>
<li>实际现象：<code><table align="center"> 在 Chrome 120+ 中已不触发居中，仅靠 margin 推动
<li>替代方案只有 CSS：要么行内写 <code>style="text-align: center;"，要么走 class + 外部样式表
text-align 能对齐什么、不能对齐什么
text-align 只控制块级容器内部的**行内级内容**（文字、<img>、<span></span>、<input> 等）的水平对齐方式。它对块级子元素无效。
- 有效：
<p style="text-align: right;">这段文字会右对齐</p> - 无效：
<div style="text-align: center;"><div>我还在左边</div></div>—— 内层<div> 是块级，不受影响 <li>想让块级子元素居中？得加 <code>display: inline-block，或换margin: 0 auto/flex - 注意：
text-align: justify会拉伸词间距，中文效果常不理想，慎用于短段落 - 整张表居中：用
margin: 0 auto（需配合display: block，因<table> 默认是 <code>display: table） - 某列统一右对齐：
<col style="text-align: right;">，比给每个<td> 加样式更轻量 <li>单个单元格内容垂直居中：<code><td style="vertical-align: middle;">，不是写在 <code><tr> 上 <li>避免 <code><td align="center">：虽部分浏览器兼容，但无法继承、无法用 CSS 选择器覆盖 <h3>Flex 布局下 <code>text-align完全失效一旦父容器设了
display: flex，text-align就彻底没用了——它只在块格式化上下文中起作用。此时对齐逻辑切换到 Flex 专属属性。- 主轴（默认水平）居中用：
justify-content: center - 交叉轴（默认垂直）居中用：
align-items: center - 若想让 flex item 内的文字左对齐，还得单独给该 item 加
text-align: left - 典型翻车：
<div style="display: flex; text-align: right">文字</div>→ 文字不会右对齐，因为容器已脱离块流
真正容易被忽略的是：对齐从来不是单一属性的事。它依赖上下文——是块流？是表格？是 Flex？还是绝对定位？选错前提，再写十遍
text-align: center都没用。 - 主轴（默认水平）居中用：
表格里对齐必须分三层处理
表格（<table>）的对齐是嵌套结构，不能只设一个 <code>align 就完事。现代做法要拆开控制：
