javascript - CSS - 给定元素之后的样式元素

Question

如何为一个又一个元素设置样式？ 例如我有这个:

<ul>
  <li>A</li>
  <li class="hiden">B</li>
  <li>C</li>
  <li>D</li>
  <li class="hiden">E</li>
  <li class="hiden">E</li>
  <li class="hiden">E</li>
  <li>F</li>
</ul>

我希望 li.hiden 之后的每个第一个 li 都有 border-top。

li + li.hiden 仅适用于 ul 中的第一个元素。

Answer 1

要定位 li.hiden 之后的第一个 li，您应该使用 li.hiden + li 选择器:

li.hiden + li {
    border-top: 1px red solid;
}

<ul>
  <li>A</li>
  <li class="hiden">B</li>
  <li>C</li>
  <li>D</li>
  <li class="hiden">E</li>
  <li>F</li>
</ul>