<分区>
<分区>
我正在尝试为 html 中的每个第二个元素制作一些背景颜色，使其与 nth-child(odd) 不同，但不知何故它没有按预期工作，因为每个 child 都有背景颜色。
这是工作 fiddle 来查看我的问题，因为它有很多要粘贴的 HTMl :)
https://jsfiddle.net/7xwgszwg/8/
<div class="col-md-12">
<div class="row">
<div class="col-md-4 accesories-box-main">
<div class="row">
<div style="background-image: url('content/images/accesories/accesories-hook.png');" class="col-md-12 accesories-box">
<h2>Heading</h2>
<p class="accesories-price" style="padding-top: 40px; padding-left: 20px;">
420
</p>
</div>
<div class="col-md-12 acccesories-description">
<p>
It also falls back to a solid color background if CSS gradients are not supported. It will work on Firefox 3.6+, Chrome, Safari, Opera 11.10+ and IE10+.
PS: For my twitter friends, I had already written this when the robbers came and I was about to post it. I might have been really calm, but not as much as making CSS experiments the same day I was robbed and threatened by a gun
</p>
</div>
</div>
</div>
<div class="col-md-4 accesories-box-main">
<div class="row">
<div style="background-image: url('content/images/accesories/accesories-roof.png');" class="col-md-12 accesories-box">
<h2>Heading</h2>
<p class="accesories-price">
420
</p>
</div>
<div class="col-md-12 acccesories-description">
<p>
It also falls back to a solid color background if CSS gradients are not supported. It will work on Firefox 3.6+, Chrome, Safari, Opera 11.10+ and IE10+.
PS: For my twitter friends, I had already written this when the robbers came and I was about to post it. I might have been really calm, but not as much as making CSS experiments the same day I was robbed and threatened by a gun
</p>
</div>
</div>
</div>
<div class="col-md-4 accesories-box-main">
<div class="row">
<div style="background-image: url('content/images/accesories/accesories-roof.png');" class="col-md-12 accesories-box">
<h2>Heading</h2>
<p class="accesories-price">
420
</p>
</div>
<div class="col-md-12 acccesories-description">
<p>
It also falls back to a solid color background if CSS gradients are not supported. It will work on Firefox 3.6+, Chrome, Safari, Opera 11.10+ and IE10+.
PS: For my twitter friends, I had already written this when the robbers came and I was about to post it. I might have been really calm, but not as much as making CSS experiments the same day I was robbed and threatened by a gun
</p>
</div>
</div>
</div>
</div>
</div>
最佳答案
除了 nt-child 中缺少 h(应该是 nth-child)，问题是.acccesories-description 元素不是兄弟元素，nth-child 区分兄弟元素。
您很可能希望将 nth-child 应用于 .accesories-box-main，然后将 .acccesories-description 作为目标用于着色
.accesories-box-main:nth-child(odd) .acccesories-description{
background-color:red;
}
关于css - 第 n 个 child (奇数)不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35893039/