<的第i;文本对齐兼容性 [英] <th> text-align compatibility
问题描述
在表格标题中， th 标签的默认文本对齐方式为center。
请考虑以下事项code：
<！DOCTYPE html>
< html>
< head>
< style type =text / css>
body {
background-color：aliceblue;
}
.default_grid {
text-align：left;
width：600px;
颜色：白色;
}
.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>
在Firefox中， Internet Explorer 7 （& lower），Safari，Chrome和 Opera ，将< th>中的文本左对齐。在 Internet Explorer \\ nbsp; 8 和 Internet Explorer 9 ，除非直接在< th>标签上指定规则（取消注释行＃14），否则文本将居中对齐。
哪一个是正确的行为？ 根据W3C的 TH的建议，
可视用户代理通常在单元格内以垂直和水平方式呈现居中的TH元素，并使用粗体字体权重。
没有提及必须的行为（？）是否必须从父项继承样式？
事实是： l浏览器在 看这张图片，我们可以概括说明哪个浏览器正在做正确的工作。禁止 text-align 和 font-weight 继承值（Internet Explorer 8及更高版本）或允许一个并删除其他（ non -Internet Explorer 8 +方式）更好;这是由供应商自行决定的。 作为设计师，一般的经验法则是我们必须选择适用于所有浏览器的实践。在这种情况下，请始终指定TH来更改 text-align 和 font-weight 的值。 In a table heading, the default text alignment for the Consider the following code: In Firefox, Internet Explorer 7 (& lower), Safari, Chrome and Opera the text in <th> is aligned left. While in Internet Explorer 8 and Internet Explorer 9, the text is aligned center unless the rule is specified directly on <th> tag (uncomment line# 14). Which one is the correct behavior? According to W3C's Recommendation for TH, Visual user agents typically render TH elements vertically and horizontally centered within the cell and with a bold font weight. There is no mentioning of how it must behave(?) Whether or not must it inherit style from the parent? Facts are: By default all browsers center align text in Internet Explorer 7 & lower, Firefox, Chrome, Safari and Opera set the (only †) text-align property of TH to inherit from the parent Internet Explorer 8 and later doesn't let the TH to inherit text-align property from parent. You have to target the TH tag via a CSS selector to change its value. † All browsers don't inherit the font-weight property from parent. You have to target the TH tag via a CSS selector to change its value. Looking at this picture, we can't generalize which browser is doing the right job. Either disallowing both text-align and font-weight to inherit value (Internet Explorer 8 and later way) or "allowing one and dropping other" (non-Internet Explorer 8+ way) is better; it's on the vendor's discretion. Being a designer, a general rule of thumb is we must choose those practices which work for all browsers. In this case, always target TH to change the value of text-align and font-weight. 这篇关于<的第i;文本对齐兼容性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
TH 元素中对齐文本。 Internet Explorer 7&更低，Firefox，Chrome，Safari和Opera将TH的<仅> 文本对齐属性设置为继承 $ c> ，< table> ，< body> 等等。 Internet Explorer ; 8 和更高版本不会让TH从父级继承 text-align 属性。您必须通过CSS选择器来定位TH标签以更改其值。 所有浏览器都不会继承 font-weight 属性。您必须通过CSS选择器来定位TH标签才能更改其值。
th tag is center.<!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>
TH element.<thead>, <table>, <body> and so on.
登录
关闭
