Question

我正在使用owl-caroussel插件，我需要将一个右边的样式应用于奇数div，当我应用这个选择器时，它只是将边框添加到类“info”的所有div中，它不会无论是偶数还是奇数：

Image

我一定做错了，这是剃须刀视图中的代码：

   section#presentation section#last div.info:nth-of-type(odd){
               border-right: 1px solid #ede1d9;
          }

如何将该边框仅添加到“info”类的奇数div？

Answer 1

看看这个：https://www.w3.org/Style/Examples/007/evenodd.en.html

.test:nth-child(odd) {
  background: #ddd;
}

<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>
<div class="test">test</div>

Answer 2

尝试使用此选择器：

section#presentation section#last .owl-carousel > div:nth-child(odd){
   border-right: 1px solid #ede1d9;
}

你们将计算所有 DIV，（nth-of-em> type ，即DIV），而不只是那些类.info

的DIV

Answer 3

要获得奇数，请使用此伪类

 .info:nth-child(2n-1) {
     your styles
 }

将不同的风格应用于奇数div

3 个答案: