Question

这是HTML。

<div class="container">
            <div> background of this i need in white </div>
            <div> background of this i need in red </div>
            <div> background of this i need in white </div>
            <div> background of this i need in red </div>
        </div>

我想在不添加class或id的情况下选择备用div。

是否可以使用 IE 7 支持

支持CSS（无Javascript）

Answer 1

IE7不支持您需要的选择器，即:nth-child()。

通常你会用

.container div:nth-child(even) {
     background: red;
}

不幸的是，

IE7 does not support it。

您需要使用JavaScript，或者为每个奇数行或偶数行添加一个类（可能使用服务器端语言）。

Answer 2

我们不能选择<div class="container">中的每一个div [与IE7引入的CSS2选择器]吗？

很好，有邻接选择器：

.container div { background: white; }
.container div+div { background: red; }
.container div+div+div { background: white; }
.container div+div+div+div { background: red; }

但这意味着为每个孩子写出一条规则（越来越笨重）。以上内容涵盖了带有四个子项的示例标记，因此对于短的固定数量的子元素是可管理的，但对于具有大量或无限数量的子元素的元素来说是不切实际的。

Answer 3

这不可能。

Answer 4

使用内联样式标记，例如，以下在IE 7中有效没有为他人考试。

<div style="background-color:#ffff00" > Hello YOU div</div>

Answer 5

div:nth-child(odd) { background-color:#ffffff; }
div:nth-child(even) { background-color:#ff0000; }

但我不知道（并且无法测试）这是否适用于IE7 - 如果没有，你将不得不为div使用不同的类。

如何使用纯CSS和IE 7支持替换颜色div？

5 个答案: