提问者:小点点

如何为od偶数添加div的第一个子项的背景


我有一个简单的部分现在我想添加背景颜色偶数或奇数的第一个孩子在一个div

下面是我的解决方案:jsfiddledemo

null

.elementor-accordion-item:nth-child(even) {
  background: #CCC
}
<div class="elementor-accordion">
  <div class="elementor-accordion-item">
    <div class="elementor-tab-title">
      1. Reumatoidalne zapalenie stawów – pielęgnacja i opieka nad pacjentem
    </div>
    <div class="content-info">
      Parkinsonizm (określany także jako zespół parkinsonowski) jest zespołem neurologicznym charakterystycznym
    </div>
  </div>
  <div class="elementor-accordion-item">
    <div class="elementor-tab-title">
      2. Reumatoidalne zapalenie stawów – pielęgnacja i opieka nad pacjentem
    </div>
    <div class="content-info">
      Parkinsonizm (określany także jako zespół parkinsonowski) jest zespołem neurologicznym charakterystycznym
    </div>
  </div>
  <div class="elementor-accordion-item">
    <div class="elementor-tab-title">
      3. Reumatoidalne zapalenie stawów – pielęgnacja i opieka nad pacjentem
    </div>
    <div class="content-info">
      Parkinsonizm (określany także jako zespół parkinsonowski) jest zespołem neurologicznym charakterystycznym
    </div>
  </div>
</div>

null

预期结果如下所示

[未提供图像链接]

不幸的是,我的解决方案只是为两个子项添加样式,而不是第一个表示标题的样式。

我需要做什么才能得到上面的结果?


共1个答案

匿名用户

不幸的是,我的解决方案只是为两个子项添加样式,而不是第一个表示标题的样式。

我们可以使用first-child选择器在nth-child()之后获取标题(first-child):

null

.elementor-accordion-item:nth-child(even) :first-child {
  background: #CCC
}
<div class="elementor-accordion">
  <div class="elementor-accordion-item">
    <div class="elementor-tab-title">
      1. Reumatoidalne zapalenie stawów – pielęgnacja i opieka nad pacjentem
    </div>
    <div class="content-info">
      Parkinsonizm (określany także jako zespół parkinsonowski) jest zespołem neurologicznym charakterystycznym
    </div>
  </div>
  <div class="elementor-accordion-item">
    <div class="elementor-tab-title">
      2. Reumatoidalne zapalenie stawów – pielęgnacja i opieka nad pacjentem
    </div>
    <div class="content-info">
      Parkinsonizm (określany także jako zespół parkinsonowski) jest zespołem neurologicznym charakterystycznym
    </div>
  </div>
  <div class="elementor-accordion-item">
    <div class="elementor-tab-title">
      3. Reumatoidalne zapalenie stawów – pielęgnacja i opieka nad pacjentem
    </div>
    <div class="content-info">
      Parkinsonizm (określany także jako zespół parkinsonowski) jest zespołem neurologicznym charakterystycznym
    </div>
  </div>
</div>