我怎么能在奇数/偶数<dd>行之间交替背景颜色

Jac*_*son 4 html css

我有一个定义列表如下:

<dt>Term1</dt>
<dd>Definition1</dd>
<dt>Term2</dt>
<dd>Definition2</dd>
<dt>Term3</dt>
<dd>Definition3</dd>
<dt>Term4</dt>
<dd>Definition4</dd>
Run Code Online (Sandbox Code Playgroud)

我想使用CSS使用nth-child(奇数)为每个奇数行提供不同的背景颜色,但这不适用于定义列表的结构,除非我可以在包装器中将每个dt和dd组合在一起.

有谁知道我可以实现这种交替背景效果的方式?

谢谢

编辑**我应该指出,我需要术语和定义并排出现.所以每对DT和DD应该有交替的颜色.

pzi*_*zin 9

这对我有用:

dt, dd {
  background-color: blue;
}

dt:nth-child(4n+1), dt:nth-child(4n+1) + dd {
  background-color: red;
}
Run Code Online (Sandbox Code Playgroud)