如何使用css排除某些特定元素的样式？

<div id="header" class="top-bar"> 
... 
</div> 

<div id="specificdiv" class="top-bar"> 
    <ul> 
     <li> 
      <li class="dropdown active"> 
      <li class="dropdown active"> 
      <li class="dropdown active"> 
     <li> 
    </ul> 
</div> 

<div id="footer" class="top-bar"> 
... 
</div>

我需要在div id="specificdiv"下排除特定<li>标签的样式。我可以用这个如何使用css排除某些特定元素的样式？

.top-bar li:not(:first-of-type) { 
    float: none; 
}

但如何删除其余2以及排除第一要素？

来源

2013-08-03 user1298426

的元素，所以你想添加样式到'top-bar'下的所有'li'？是不是创建嵌套'li'好主意？ –

为什么你有'li'元素直接嵌套在'li'中？ – BoltClock

它没有嵌套。我对.top-bar li风格进行了一些修改，这就是当我用萤火虫检查它时会发生混乱...所以我需要排除这种风格.top-bar .li – user1298426

使用直接后代选择器>。它只选择目标父母的直系后代。

您可以使用#specificdiv ul > li，它只会在第一级儿童中选择li。

正如BoltClock指出的那样，您应该包装li，其父母为li，其内部为ul。

<div id="specificdiv" class="top-bar"> 
    <ul> 
    <li> 
     <ul> 
     <li class="dropdown active"> 
     <li class="dropdown active"> 
     <li class="dropdown active"> 
     </ul> 
    <li> 
    </ul> 
</div>

来源

2013-08-03 04:59:23

的，你需要第n个孩子（一个+ B），你可以使用它像这样

li:nth-child(2){ 
    .. 
} 
li:nth-child(3){ 
    .. 
}

现在你的hve很多替代

ul li:nth-child(3n+3) { 
    color: #ccc; 
} 



li:nth-child(4n-7) { /* or 4n+1 */ 
    color: green; 
}

，如果你想检查特殊的使用>像这样

div#pecificdiv ul.myList >li:nth-child(odd) { 
    color: green; 
}

检查此链接有用的第n个孩子食谱

http://css-tricks.com/useful-nth-child-recipies/

这

http://css-tricks.com/how-nth-child-works/

来源

2013-08-03 05:00:28

你为什么不只是添加类为<li>，要风格？例子：

<ul> 
    <li class="someClass"> 
     <li class="dropdown active"> 
     <li class="dropdown active"> 
     <li class="dropdown active"> 
    <li> 
</ul>

然后你的风格：

.someClass{ 
    float:none; 
    }

来源

2013-08-03 05:02:17

对不起...李不是嵌套在李...它实际上是像科迪古尔德纳提到的...我的错字错误... – user1298426

#specificdiv li:not(:first-of-type) 
{ 
    float: none; 
}

它会奏效。

＃用于通过id选择元素。例如#my将选择具有id =我的

来源

2013-08-03 05:03:19

但这只是排除第一个元素。 – user1298426

你能否详细说明你想做什么。哪个元素应用这个样式。 –

如何使用css排除某些特定元素的样式？

回答

相关问题