不是:第一个孩子选择器 [英] not:first-child selector

问题描述

我有一个div标签，其中包含几个ul标签.

I have a div tag containing several ul tags.

我只能为第一个ul标签设置CSS属性:

I'm able to set CSS properties for the first ul tag only:

div ul:first-child {
    background-color: #900;
}

但是，我的以下尝试为除第一个标签之外的每个其他ul标签设置CSS属性不起作用:

However, my following attempts to set CSS properties for each other ul tag except the first one don't work:

div ul:not:first-child {
    background-color: #900;
}

div ul:not(:first-child) {
    background-color: #900;
}

div ul:first-child:after {
    background-color: #900;
}

如何在CSS中编写除第一个元素外的每个元素"?

How can I write in CSS: "each element, except the first"?

推荐答案

您发布的其中一个版本实际上适用于所有现代浏览器 (其中第3级CSS选择器是

One of the versions you posted actually works for all modern browsers (where CSS selectors level 3 are supported):

div ul:not(:first-child) {
    background-color: #900;
}

如果您需要支持旧版浏览器，或者:not选择器的限制受阻(它仅接受简单选择器作为参数)，则可以使用另一种技术:

If you need to support legacy browsers, or if you are hindered by the :not selector's limitation (it only accepts a simple selector as an argument) then you can use another technique:

定义一个范围比您想要的规则更大的规则，然后有条件地撤销"它，将其范围限制为您想要的意图:

Define a rule that has greater scope than what you intend and then "revoke" it conditionally, limiting its scope to what you do intend:

div ul {
    background-color: #900;  /* applies to every ul */
}

div ul:first-child {
    background-color: transparent; /* limits the scope of the previous rule */
}

在限制范围时，请为您所使用的每个CSS属性使用默认值设置.

When limiting the scope use the default value for each CSS attribute that you are setting.

这篇关于不是:第一个孩子选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！