text-align: left 必须写在td或th上才生效，因table不渲染文本；给table设置无效，实际左对齐来自td默认行为，需显式声明td{ text-align: left; }并避免align属性。
text-align: left 必须写在 td 或 th 上才生效，不是写在 table 上——后者不渲染文本，纯属“假装有用”。
为什么给 table 加 text-align: left 没反应
浏览器根本不会用这个样式去对齐任何文字，因为 table 元素自身不包含可渲染的文本内容。你看到的左对齐，其实是 td 默认行为；一旦父容器有 text-align: center 或全局重置样式干扰，就立刻失效。
- 检查上级元素是否设置了
text-align: center或display: flex; justify-content: center - 别依赖默认值：显式写
td { text-align: left; }才可靠 - 如果表头要居中、数据要左对齐，分开写更安全：
th { text-align: center; }+td { text-align: left; }
怎么只让某几列左对齐（比如姓名列、地址列）
用 :nth-child(n) 最稳，它按列位置匹配，不依赖类名，也不怕 thead/tbody 结构变化。
- 必须同时选中
th和td，否则表头和数据错位：th:nth-child(1), td:nth-child(1) { text-align: left; } - 别用
tr td:first-child：那只影响第一行首列 - 别用
:nth-of-type()：在混合colgroup或动态插入行时容易漏掉
留空隙不是靠 text-align，而是靠 padding
text-align 只管文字在单元格里的水平位置，和“离边框多远”完全无关。所谓“留出空隙”，本质是控制文字与单元格内边距的距离。
立即学习“前端免费学习笔记（深入）”；
- 加左边空隙：用
padding-left，比如td { padding-left: 16px; } - 统一四边：用
padding: 4px 12px;表示上下 4px、左右 12px - 别混用
align="left"属性：HTML5 已废弃，Chrome/Firefox/Safari 行为不一致，W3C 验证器直接报错
移动端表格左对齐容易视觉失衡，怎么微调
小屏幕横向压缩后，th 居中 + td 左对齐会显得表头“空得太多”，而数据紧贴左边界，看起来不对齐。
- 给
th加一点左右内边距：th { padding-left: 0.75em; padding-right: 0.75em; } - 避免
white-space: nowrap强制撑宽列，它会让左对齐文字失去呼吸感 - 如果某列含图标或小字号内容，配合
vertical-align: top让文字贴顶，比默认middle更紧凑
真正难的不是写对一行 CSS，而是判断该把样式写在哪一层：是整张表、某类列、还是单个单元格？一不留神，td 的 padding 就被父级 table 的 margin 挤压变形，或者 nth-child 在动态渲染时突然失效。动手前先 inspect 一下实际生效的样式链路，比猜更有用。
