我是HTML的新手,我只想创建一个基本表格,我可以在CSS中指定列的宽度。
我正在创建一组HTML帐户(35页文档),因此表格是我需要制作的基础,并且整个html中将使用大约5个标准表格。
我快速前进,下面的代码似乎与我需要的完全相同,但是td:first-child在IE中不起作用。
我搜索过并且支持它。谁能告诉我我做错了什么?如果有更好的方法,请告诉我。
<html>
<head>
<title>Company Accounts</title>
<style type="text/css">
table { width: 264mm; border: 1px solid; table-layout:fixed}
td {border: 1px solid; padding: 5px}
.T1C1 td:first-child {width: 10mm; text-align:right}
.T1C2 td:first-child + td {width: 50mm}
.T1C3 td:first-child + td + td {width: 10mm; text-align:right}
.T1C4 td:first-child + td + td + td {width: 50mm; text-align:right}
</style>
</head>
<body>
<table class="T1C1 T1C2 T1C3 T1C4">
<tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr>
<tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr>
<tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr>
<tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr>
<tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> </tr>
</table>
</body>
</html>
答案 0 :(得分:2)
:first-child
伪类是Quirks Mode中IE不支持的众多CSS功能之一。这就是为什么添加doctype有帮助,如评论中所述。但它不仅仅是任何文档类型。它必须是在IE中触发“标准模式”的一个,例如<!doctype html>
,放在HTML文档的最开头。
Microsoft文档中明确描述了这个特殊的怪癖:
“注意Pseudo-class仅在符合标准的模式下启用(严格!DOCTYPE)。”
http://msdn.microsoft.com/en-us/library/ie/cc848865%28v=vs.85%29.aspx
但是,文档中的“严格”一词具有误导性,并且除了链接页面上列出的文档类型之外
http://msdn.microsoft.com/en-us/library/ie/ms535242%28v=vs.85%29.aspx
HTML5 doctype <!doctype html>
也有效,
答案 1 :(得分:0)
以下是此css伪类的引用:https://developer.mozilla.org/en-US/docs/CSS/:first-child
您可以在那里找到浏览器兼容性表。
页面底部有一些IE警告:
在动态添加元素时,Internet Explorer 7不会更新样式。在Internet Explorer 8中,如果通过单击链接动态插入元素,则在链接失去焦点之前不会应用第一个子样式。