如何select在CSS中每第n个元素之后的一组元素？

Question

如何select一组元素出现在CSS中第n个元素之后？例如：加粗前三项，跳过后三项，加粗前三项等等...

0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0

Answer 1

简单。你不能 select 出现组，但你可以 select 每 N 个元素。

因此，您需要 select 6 的倍数，并将第 3 个元素设置为从循环 N 偏移 +1、+2 和 +3 的样式，如下所示：

以下简单来说就是："every 6 elements, style only the 1st, 2nd and 3rd one"

p:nth-child(6n+1), 
p:nth-child(6n+2), 
p:nth-child(6n+3) {
    font-weight:bold;
    font-style:italic;
}
p {
    display:inline;
}

<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>
<p>O</p>

如何select在CSS中每第n个元素之后的一组元素？

How to select a group of elements after every nth-element in CSS?

html

css