1

我是 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>
4

2 回答 2

2

:first-child伪类是 IE 在Quirks Mode中不支持的众多 CSS 功能之一。正如评论中提到的，这就是为什么添加 doctype 会有所帮助的原因。但这不仅仅是任何文档类型。它必须是在 IE 中触发“标准模式”的一个，例如<!doctype html>，放置在 HTML 文档的开头。

这个特殊的怪癖在 Microsoft 文档中明确描述：“注意伪类仅在标准兼容模式下启用（严格！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>也可以，

于 2012-09-12T10:09:21.050 回答
0

这是此 css 伪类的参考：https ://developer.mozilla.org/en-US/docs/CSS/:first-child

您可以在那里找到浏览器兼容性表。

页面底部有一些针对 IE 的警告：

动态添加元素时，Internet Explorer 7 不会更新样式。在 Internet Explorer 8 中，如果通过单击链接动态插入元素，则在链接失去焦点之前不会应用第一个子样式。

于 2012-09-12T08:18:32.323 回答