CSS Selector，每2个div应用一次CSS

Question

我在CSS中定位div的问题。

我的代码是这样的：

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

这就是为什么我要这样做：应用一些CSS但仅限于第一和第三个＆＃34;测试＆＃34; div（如果有6个卡片div则为5）。

我尝试使用:nth-child(odd)，但没有成功。

Answer 1

也许你没有正确应用它试试这个Fiddle

.card:nth-child(odd){
color:green;
}

＆＃13;

＆＃13;

.card:nth-child(odd){
    color:green;
}

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;

修改

如果您想将其应用于test，请尝试使用此Fiddle

＆＃13;

＆＃13;

.card:nth-child(odd) .test{
    color:green;
}

＆＃13;

<div class="card">
  <div class="test">Asdasdasd</div>
</div>
<div class="card">
  <div class="test">Asdasddfdfsvxcvasd</div>
</div>
<div class="card">
  <div class="test">Asdasdasd</div>
</div>
<div class="card">
  <div class="test">Asdasdasd</div>
</div>

＆＃13;

＆＃13;

＆＃13;