我有一个如下定义列表:
<dt>Term1</dt>
<dd>Definition1</dd>
<dt>Term2</dt>
<dd>Definition2</dd>
<dt>Term3</dt>
<dd>Definition3</dd>
<dt>Term4</dt>
<dd>Definition4</dd>
我想使用CSS使用nth-child(奇数)为每个奇数行赋予不同的背景颜色,但这不适用于定义列表的结构,除非我可以在包装器中将每个dt和dd组合在一起
有人知道我可以实现这种交替背景效应吗?
由于
编辑** 我应该指出,我需要术语和定义并排出现。所以每对DT&amp; DD应该有交替的颜色。
答案 0 :(得分:8)
这对我有用:
dt, dd {
background-color: blue;
}
dt:nth-child(4n+1), dt:nth-child(4n+1) + dd {
background-color: red;
}
答案 1 :(得分:0)
试
dt:nth-child(odd){ background-color:#eee; }
dd:nth-child(even){ background-color:#fff; }