html - TD :first-child does not seem to work in IE

标签 html css

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

最佳答案

:first-child伪类是 IE 不支持的众多 CSS 特性之一 Quirks Mode .这就是添加文档类型有帮助的原因,如评论中所述。但这不仅仅是任何文档类型。它需要是在 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 html>也可以,

关于html - TD :first-child does not seem to work in IE,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12383068/

相关文章:

php - PDO FETCH 全部返回 HTML 中的一行

javascript - 调整背景 Sprite 图像的大小以适应 div

javascript - async=true 用于 css 链接标签

悬停时的 CSS 过渡动画在 Firefox 中不起作用

javascript - mmenu 不工作,看起来像普通的 html

javascript - 通过 JSON 进行搜索并在 HTML 页面中显示结果

javascript - 通过在移动设备上最大化 plyr.io 来强制横向模式?

html - css:向左导航滚动

html - 将样式应用于 HTML 导航栏中的事件项

javascript - Angular.js Controller 不工作