我怎么能目标块后另一个块与css



我的html是这样的:

<ul>
  <li class="myItemClass">item foo</li>
  <li class="myItemClass specialItemClass">item foo</li>
  <li class="myItemClass">item foo</li>
  <li class="myItemClass">item foo</li>
  <li class="myItemClass specialItemClass">item foo</li>
  <li class="myItemClass specialItemClass">item foo</li> <!-- problem here -->
  <li class="myItemClass">item foo</li>
  <li class="myItemClass">item foo</li>
</ul>

现在我想为一个具有'specialItemClass'的项目定义一个css样式,该项目位于具有'specialItemClass'的项目之后。我该怎么做呢?

进一步解释:'specialItemClass'包含一个2px的彩色边框。但是如果两个特殊的物品在彼此的正下方,边界就会翻倍。所以我不想在顶部[或底部]添加特殊边框,如果上面[或下面]有另一个特殊项

使用相邻的兄弟选择器+

.specialItemClass + .specialItemClass{
    /*styles here*/
}

使用邻接css3选择器来解决您的问题。最好只有特定的选择器。请看小提琴

li.specialItemClass + li.specialItemClass{
  border-top:none;
}
https://jsfiddle.net/0ou3a02u/

最新更新