斑马css与选择器(跳过线)

时间:2016-11-03 13:01:21

标签: css css-selectors

我需要一个关于div的斑马css,但不包括带有"主题"类 我能这样做吗?

修改 我希望每个主题课都会从头开始计算斑马数。

<style>
 .msg:nth-child(odd) {  background-color: Red;}
</style>
<div class="msg topic">
<div class="msg">
<div class="msg">
<div class="msg">
<div class="msg topic">
<div class="msg">
<div class="msg">

编辑2: 像这样的东西

<div class="msg topic">
<div class="msg class1">
<div class="msg class2">
<div class="msg class1">
<div class="msg topic">
<div class="msg class1">
<div class="msg class2">
<div class="msg class1">
<div class="msg class2">

1 个答案:

答案 0 :(得分:2)

像...那样的东西? (https://jsfiddle.net/uus62q3t/

HTML:

<div class="msg topic">msg topic</div>
<div class="msg">msg</div>
<div class="msg">msg</div>
<div class="msg">msg</div>
<div class="msg topic">msg topic</div>
<div class="msg">msg</div>
<div class="msg">msg</div>

CSS:

.msg:nth-child(odd):not(.topic) {  background-color: Red;}

 .topic { background:yellow; /* just for demo */}