<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>复合选择器</title>
<style type="text/css">
/*交集选择器*/
li.odd{
background: red;
}
</style>
</head>
<body>
<ul>
<li>仙剑奇侠传</li>
<li class="odd">仙剑奇侠传二</li>
<li>仙剑奇侠传三</li>
<li class="odd">仙剑奇侠传四</li>
<li>仙剑奇侠传五</li>
</ul>
<p class="odd">不添加侠剑奇侠传</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>复合选择器</title>
<style type="text/css">
/*交集选择器*/
li.odd{
background: red;
}
/*并集选择器*/
li,.odd{
color: blue;
}
</style>
</head>
<body>
<ul>
<li>仙剑奇侠传</li>
<li class="odd">仙剑奇侠传二</li>
<li>仙剑奇侠传三</li>
<li class="odd">仙剑奇侠传四</li>
<li>仙剑奇侠传五</li>
</ul>
<p class="odd">不添加侠剑奇侠传</p>
</body>
</html>