不是:第一个孩子选择器

我有一个div标签包含几个ul标签。

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

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

然而，我下面的尝试为其他ul标签设置CSS属性除了第一个不工作:

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:“每个元素，除了第一个”?

当前回答

div ul::nth-child(n+2){
    background-color: #900;
}

也起作用了

2022-04-26 15:29:19

其他回答

li + li {
    background-color: red;
}

2020-07-22 08:13:38

div li~li {
    color: red;
}

支持IE7

2014-10-16 11:10:18

你发布的一个版本实际上适用于所有现代浏览器(支持CSS选择器级别3):

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

如果你需要支持旧浏览器，或者你被:not选择器的限制(它只接受一个简单的选择器作为参数)所阻碍，那么你可以使用另一种技术:

定义一个比你想要的范围更大的规则，然后有条件地“撤销”它，将其范围限制在你想要的范围内:

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

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

在限制作用域时，使用您正在设置的每个CSS属性的默认值。

2012-09-05 21:11:23

你可以像下面这样使用:not你可以使用:not()里面的任何选择器

any_CSS_selector:not(any_other_CSS_selector){
    /*YOUR STYLE*/
}

你也可以使用:not without parent selector。

   :not(:nth-child(2)){
        /*YOUR STYLE*/
   }

更多的例子

any_CSS_selector:not(:first-child){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:first-of-type){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:checked){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:last-child){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:last-of-type){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:first-of-type){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:nth-last-of-type(2)){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:nth-last-child(2)){
    /*YOUR STYLE*/
}
any_CSS_selector:not(:nth-child(2)){
    /*YOUR STYLE*/
}

2019-05-04 04:04:08

Not (:first child)似乎不再起作用了。至少最新版本的Chrome和Firefox是这样的。

相反，试试这个:

ul:not(:first-of-type) {}

2017-08-19 16:36:14

不是:第一个孩子选择器

推荐文章

最新文章

标签