表格内容右对齐应使用text-align: right，而非已废弃的align="right"；该CSS属性必须作用于td或th元素才生效，推荐按列加类名（如.price）或使用nth-child选择器实现精准控制。
表格内容右对齐该用 text-align: right，不是 align="right"
HTML5 已废弃 align 属性，align="right" 写在 <td> 或 <th> 上虽可能“看起来有效”，但属于过时写法。它和 CSS 冲突：Firefox 可能忽略，Chrome 可能覆盖内联 style，调试时行为不一致。
真正可靠的做法只有一条：td, th { text-align: right; }。它语义清晰、可继承、不影响屏幕阅读器，且打印样式也正常。
- 按列控制右对齐（如金额列）：
td:nth-child(3), th:nth-child(3) { text-align: right; } - 按语义加类更灵活：
<td class="price">¥99.00</td>+.price { text-align: right; font-family: monospace; }（等宽字体防小数点错位） - 避免给整张表设
text-align—— 它不会作用于<table>自身，只影响其内部块级子元素（实际几乎无效果）
margin: 0 auto 让表格居中，但必须设 width
<table align="center"> 是浮动行为，不是块级居中，HTML5 已废弃，W3C 验证器报错，且在 flex 或 grid 容器里直接失效。
唯一可靠的居中方式是 margin: 0 auto，但它有个硬性前提：表格必须有明确宽度，否则 auto 无效。
立即学习“前端免费学习笔记（深入）”；
- 最简写法：
<table style="width: 800px; margin: 0 auto;"> - 响应式友好写法：
<div style="display: flex; justify-content: center;"><table></table></div>（无需固定宽，IE11+ 支持） - 用
text-align: center包裹display: inline-table表格也可行，但窄屏下易换行，慎用于动态列数场景
vertical-align 只对 td/th 内容生效，且需高度支撑
valign="middle" 是旧属性，值写成 "center" 会完全失效（正确值只有 top、middle、bottom、baseline），且不能加在 <table> 上——加了也白加。
现代写法是 td, th { vertical-align: middle; }，但它只作用于单元格内部内容，且依赖单元格有足够高度（比如设置了 height 或内容撑开）。空单元格或单行文本常看不出效果。
- 若要让多行文本垂直居中，建议配合
line-height或用display: flex; align-items: center;替代 -
vertical-align对<img>默认是baseline，常导致底部留白，统一设vertical-align: middle可解决 - 不要指望
tr上设vertical-align能控制整行——它只影响该行内每个td/th的内容对齐
表单元素对齐别靠 align，用 flex + vertical-align: middle
<label> 和 <input> 默认不对齐，根本原因是基线（baseline）不同，不是 margin 不够。强行加 margin-top 会随字体、缩放、浏览器变化而偏移。
稳定解法是把每组 <label> + <input> 包进一个 flex 容器，并统一设置对齐基准：
<div class="form-row"><label>用户名</label><input type="text"></div>- CSS：
.form-row { display: flex; align-items: center; gap: 0.5em; } - 所有表单控件（
input、select、button）加vertical-align: middle，避免 baseline 混乱 - 禁用
float布局表单——脱离文档流后对齐完全不可控
复杂点在于 iOS Safari 对 label 点击区域的处理，如果 label 用了 for 属性但没显式设 cursor: pointer，点击可能失灵；这点容易被忽略。
