Google Chrome 中 th 的默认文本对齐

Question

问题

当浏览器默认没有指定text-align: center; 时，为什么th 元素的文本居中？

系统设置

• MacBook Pro，2014 年中
• OS X v 10.10.2
• Google Chrome v 40.0.2214.94（64 位）
• 截至发帖时所有软件都是最新的

示例代码

<!-- no external or internal CSS applied.
     browser default styles only. -->
<table width="500" border="1"> <!-- attributes for debugging only. never use these attributes in real code (use CSS instead). -->
    <tr><th> table heading </th><th> centered text     </th></tr>
    <tr><td> table data    </td><td> left-aligned text </td></tr>
</table>

屏幕截图

HTML 渲染：

第一个 th 元素上的开发工具：

我在这里看不到text-align: center;，但很明显th 中的文本是居中对齐的。这是 Chrome 的错误吗？

相关问题

<th> text-align compatibility

更新

从 Chrome v67 开始，th 现在默认具有指定的 text-align: -internal-center;。

Answer 1

我现在对提到的old question 发布了一个新答案。我希望它能澄清情况，但由于这个问题实际上并不是重复的，而是关于浏览器行为的具体问题，所以我在此处包含相关点：

Chrome（和 Firefox）以特殊方式实现 th 元素，这与任何规范都不一致，包括 HTML5 中的“建议渲染”，尽管它经常导致相同的结果.实际上，th 没有浏览器默认样式表规则，但是当应用了正常的 CSS 级联并且它不会为 th 产生任何 text-align 的值时，然后神奇地分配了值 center它（而不是按照规范的 left 的初始值）。这可能是旧 CSS 前时代的遗留物，当时 th 只是居中。

如果您在开发工具的“已计算”选项卡中检查没有 CSS 设置的表格中的 th 元素，即使内容实际上居中，text-align 也不会显示任何值。如果您选中“显示继承的属性”（这意味着比名称所说的更多），您可以看到text-align: center。