html - 对奇数 div 应用不同的样式

Question

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

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

我一定是做错了什么，这是 razor View 中的代码:

<section id="last">

        <div class="row">
            <div class="col-lg-9 col-md-8 col-sm-12 col-xs-12 newswidth">                   
                <div id="news-wrap">
                    <div id="owl-example" class="owl-carousel owl-theme">
                        <!--item-->
                        @{  var counter = 0;}
                        @foreach (var itemBlogList in Model.BlogList)
                        {

                            if (counter == 4)
                            {
                                break;
                            }
                            <div class="info">
                                <a href="@itemBlogList.Link" class="title">@itemBlogList.Title</a>
                                <div class="credentials">
                                    <div class="author">PETER SCHULTZ</div>
                                    <div class="date">@itemBlogList.PublishDate</div>
                                </div>
                                <div class="cut">
                                    @Html.Raw(@itemBlogList.Text)
                                </div>
                            </div>
                            counter++;
                        }

                    </div>
                </div>
            </div>

            </div>
</section>

如何将该边框添加到类“信息”的奇数 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>