<th>文本对齐兼容性

Question

<th>文本对齐兼容性

在表标题中,th标记的默认文本对齐方式是居中.

请考虑以下代码:

<!DOCTYPE html>
<html>
    <head>
        <style type="text/css">
            body {
                background-color: aliceblue;
            }
            .default_grid {
                text-align: left;
                width: 600px;
                color: white;
            }
                .default_grid th {
                    /*  text-align: left;  */
                }
                .default_grid .first {
                    background-color: purple;
                }
                .default_grid .second {
                    background-color: orange;
                }
        </style>
    </head>
    <body>
        <table class="default_grid">
            <thead>
                <tr>
                    <th class="first">Test One</th>
                    <th class="second">Test Two</th>
                </tr>
            </thead>
        </table>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

在Firefox,Internet Explorer 7(及更低版本),Safari,Chrome和Opera中,<th>中的文本左对齐.在Internet Explorer 8和Internet Explorer 9中,除非直接在<th>标记上指定规则(取消注释第14行),否则文本将对齐居中.

哪一个是正确的行为？

Answer 1

vul*_*ven 17

根据W3C 对TH的建议,

可视用户代理通常在单元格内垂直和水平居中渲染TH元素,并使用粗体字体重.

没有提到它必须如何表现(？)它是否必须从父母继承风格？

事实是:

默认情况下,所有浏览器都将TH元素中的文本对
Internet Explorer 7中和下,火狐,Chrome,Safari和Opera设置(仅†)的text-align TH的财产继承从父<thead>,<table>,<body>等等.
Internet Explorer 8及更高版本不允许TH 从父级继承text-align属性.您必须通过CSS选择器定位TH标记以更改其值.
†所有浏览器都不从父级继承font-weight属性.您必须通过CSS选择器定位TH标记以更改其值.

看看这张图片,我们无法概括哪个浏览器正在做正确的工作.不允许使用text-align和font-weight来继承值(Internet Explorer 8及更高版本)或"允许删除其他"(非Internet Explorer 8+方式)更好; 这是由供应商自行决定的.

作为设计师,一般的经验法则是我们必须选择适用于所有浏览器的实践.在这种情况下,始终以TH为目标,以更改text-align和font-weight的值.

归档时间：	13 年，7 月前
查看次数：	13931 次
最近记录：	7 年，11 月前