css - CSS :first-child 选择器 IE7

Question

我有一点 IE7 问题。我有以下 CSS 代码，但它在 IE7 中不起作用。但是， .row [class*="span"] 和 :first-child 如果没有组合在一起，它们都可以工作。有没有办法做类似的事情或让它以某种方式工作？

.row [class*="span"]:first-child {
    margin-left: 0;
}

Answer 1

如果第一个孩子是 [class*="span"]，请检查它之前是否有 HTML 注释。如果有，IE7 会错误地认为注释是第一个子元素，因此它不会匹配您要查找的元素。

如果您无法更改标记以删除评论，您可以使用我在此处描述的覆盖技术解决它：

.row [class*="span"] {
    margin-left: 0;
}

.row [class*="span"] ~ [class*="span"] {
    margin-left: /* Reset the left margin for other elements */;
}

如果您不知道将其重置为的边距值，您可以尝试添加另一个针对 IE7 行为的选择器* + html：

.row [class*="span"]:first-child, * + html .row :first-child + [class*="span"] {
    margin-left: 0;
}

:first-child + [class*="span"]如果该元素恰好跟在 IE7 中的第一个子节点的一个注释节点之后，则匹配该元素。