css - 将样式应用于 DIV，除了第一行

Question

我们有一个左导航，我想稍微调整一下。请不要批评 HTML 的有效性，我们有一个 CMS 和外部开发人员正在推动这艘船，坦率地说，它现在可以工作。

我想要做的是对<DIV>s 之后的 s应用一种样式<DIV class="nav_selected">，我只想用一些缩进它们padding-left:30px;

就是这样，但是我尝试过的所有内容也适用于“ nav_selected ” div，这是我不想要的。它是一种标题，其下的 div 是子项。

<div class="left_nav_2">
 <div class="left_nav_2_container">
  <ul class="no_bottom_border">
   <div class="nav_selected"><li><h2><a href="#">Link 1 Selected</a></h2></li></div>
   <div><li><a href="#">Link 2</a></li></div>
   <div><li><a href="#">Link 3</a></li></div>
  </ul>
 </div>
</div>

Answer 1

您可以尝试为第一行创建一个类，然后使用否定伪类来使用它。

   :not(/*put all the classes in your css document here.*/){ /* put the css you want for it here.*/}

Answer 2

像这样的东西也可以工作：

CSS

.no_bottom_border li{
  padding-left: 30px;
}

.no_bottom_border .nav_selected li{
  padding-left: 0px;
  // or just the opposite values of the .no_bottom_border li
}

是这样的吗？

Answer 3

好的，你可以使用这个：

ul.no_bottom_border > div:not(:first-child) {
    padding-left: 30px;
}

希望能帮助到你

Answer 4

这是你想要的

将 padding-left 添加到两个 div 中，例如

.no_bottom_border li{
   padding-left: 30px;
}

.nav_selected li{
   padding-left: 0px;
}