Html CSS-奇偶不起作用

我想使用伪选择器奇数-偶数。但如果元素序列被另一个元素（例如标题）分割，则奇数和偶数的顺序被打破。我如何继续最初的订单

HTML

---

将每个图形集包装到另一个div中将按预期工作

<div class="fig">
    <div>
        <figcaption>t</figcaption>
        <figcaption></figcaption>
    </div>
    <div>headline</div>  
    <div>
        <figcaption></figcaption>
        <figcaption></figcaption>
        <figcaption></figcaption>
    </div>
</div>

T
大字标题

将每个图形集包装到另一个div中将如您所期望的那样工作

<div class="fig">
    <div>
        <figcaption>t</figcaption>
        <figcaption></figcaption>
    </div>
    <div>headline</div>  
    <div>
        <figcaption></figcaption>
        <figcaption></figcaption>
        <figcaption></figcaption>
    </div>
</div>

T
大字标题

只需使用

figcaption:nth-of-type(odd)
figcaption:nth-of-type(even)

只需使用

figcaption:nth-of-type(odd)
figcaption:nth-of-type(even)

：第n个子项（奇数）

不检查

figcaption

的编号，并根据它计算奇数和偶数。它基于父元素

div

：第n个类型（奇数）

它检查

figcaption

的编号，并根据编号计算奇数和偶数

：第n个子项（奇数）

不检查

figcaption

的编号，并根据它计算奇数和偶数。它基于父元素

div

：第n个类型（奇数）

它检查

figcaption

的编号，并根据编号计算奇数和偶数

---

你读过第n个孩子（偶数）和第n个孩子（奇数）做什么吗？这将是一个很好的开始。第n个子（n）选择器匹配第n个子元素的每个元素，无论其父元素的类型如何。忘记CSS吧，1）为什么要使用

div class=fig

而不是

figure

？2） 为什么“标题”有一个

div

？3）什么是“标题”在一系列的<代码>图> <代码> s的中间？4） 为什么你在同一个父母身上有这么多的

figcaption

s？你读过

n个孩子（偶数）

和

n个孩子（奇数）

做什么吗？这将是一个很好的开始。第n个子（n）选择器匹配第n个子元素的每个元素，无论其父元素的类型如何。忘记CSS吧，1）为什么要使用

div class=fig

而不是

figure

？2） 为什么“标题”有一个

div

？3）什么是“标题”在一系列的<代码>图> <代码> s的中间？4） 首先，为什么在同一个父级中有这么多的

figcaption

s？虽然这是事实，但如果OP能够修改HTML，那么他们真的应该重写整个内容。除了不清楚标记应该表示什么之外，因此很难建议如何编写标记。虽然这是事实，但如果OP能够修改HTML，那么他们真的应该重写整个内容。除了不清楚标记应该表示什么，所以很难建议如何编写标记。