text-align加了没反应最常见原因是作用对象理解错误：它只控制块级容器内行内内容的水平对齐，不控制块级子元素自身位置，也不影响float、absolute或flex等脱离文档流的元素。
text-align 为什么加了没反应
最常见的失效不是代码写错，而是作用对象理解偏差：text-align 只控制**块级容器内行内内容的水平位置**，不移动块本身，也不影响脱离文档流的子元素。
典型现象：<div style="text-align: right;"><button>提交</button></div> 中按钮不动；<p style="text-align: center;">文字</p> 文字却左对齐。
- 子元素是块级（如
<div>、<p>、<button>）且没设宽度 → 它占满父宽，text-align对它“内部”起效，但按钮自身位置不变 - 子元素用了
float、position: absolute或display: flex→ 脱离普通流，text-align完全失效 - 把
text-align写在行内元素上（如<span style="text-align: center">）→ 属性必须由父容器声明，<span>自身不接受该样式
表格里 text-align 和 vertical-align 怎么配着用
表格对齐要分两层：单元格内容的水平位置靠 text-align，垂直位置靠 vertical-align，两者互不替代，也不能写错位置。
vertical-align 只对 <td> 和 <th> 有效，写在 <table> 或 <tr> 上毫无作用；text-align 同理，写在 <table> 上只影响其内部所有 <td> 的文本，不影响表格在页面中的位置。
立即学习“前端免费学习笔记（深入）”；
- 单个单元格居中：
<td style="text-align: center; vertical-align: middle;">数据</td> - 整列统一：
<col style="text-align: right;">+td, th { vertical-align: middle; } - 数字右对齐但小数点错位？
text-align: right是基础，还需font-variant-numeric: tabular-nums或等宽字体配合
margin: 0 auto 为什么表格还是靠左
让整个 <table> 在页面中水平居中，唯一可靠方式就是 margin: 0 auto，但它有两个硬性前提，缺一不可。
常见错误是只写了 margin: 0 auto 却忘了宽度——浏览器无法计算左右 margin 的基准，直接忽略该声明。
- 必须设置明确宽度：
width: 80%、width: 600px或响应式组合如width: 100%; max-width: 800px; - 不能用
width: 100%单独写——它撑满父容器，左右无空余，automargin 失效 - 避免父容器有
float、display: inline或overflow: hidden，这些会破坏块级上下文 - 别用
display: flex包裹表格来“居中”——会干扰colspan/rowspan渲染，打印和读屏器可能出错
align 属性还能用吗
不能。HTML5 已正式废弃 align 属性，无论出现在 <table>、<tr>、<td> 还是 <h2> 上，它都属于非法标记。
浏览器出于兼容性可能仍解析 align="center"，但行为不可控：<table align="center"> 实际触发的是 display: inline-table，导致后续 width 和 margin 失效；旧版 WebView 或严格 doctype 下直接忽略。
- W3C 验证器报错：
Attribute align is obsolete. Use CSS instead. - 无障碍工具可能跳过带
align的元素，影响可访问性 - 现代构建工具（Vite/ESLint）会警告或拦截，CI 流水线可能失败
- 替代方案明确：
text-align控制内容对齐，margin: 0 auto控制表格居中，vertical-align控制单元格内垂直对齐
style，四者叠加时，不看浏览器开发者工具里的 computed styles，光靠改代码只会越调越乱。 
