1.多选择器
（1）逗号选择器
<h1>zx</h1><h2>sd</h2><h3>gh</h3><h4>bn</h4><h5>tu</h5><div class="text">tyu</div>
<style>h1,h2,h3,h4,h5,.text{color: yellowgreen;}</style>
（2）组合选择器
<div class="word">asd</div><div class="baidu">百度</div><div>淘宝</div>
<style>div.baidu{color: slateblue;}</style>
2. 属性选择器
<div class="text">属性选择器1</div><div class="text">属性选择器7</div><div class="text2">属性选择器2</div><div class="word">属性选择器3</div><div class="head">属性选择器4</div><div class="table">属性选择器5</div><div class="number">属性选择器6</div><div class="number number1;number2">属性选择器8</div>
<style>/* [class] {color: slategrey;background-color: tan;}[class=text]{color: tomato;background-color: turquoise;}[class^=t]{color: yellow;background-color: teal;}[class$=d]{color:seagreen;background-color: silver;}[class*=text]{color: slateblue;background-color: springgreen;}*/[class~=number]{color: tan;background-color: steelblue;}</style>
3.伪类选择器
<div class="top"><p>独生子</p><h1>独生子</h1></div><ul><li>html</li><li>css</li><li>js</li><li>js</li><li>js</li><li>js</li><li>js</li><li>js</li></ul><a class="baidu" href="#">百度</a><div class="line">---------</div>
<style>/*.top:only-child{background-color: violet;}ul li:first-child{background-color: rgb(0, 255, 64);}ul li:last-child{background-color: seagreen;}*/ul li:nth-child(even){background-color: sienna;}ul li:nth-last-child(even){background-color: rgb(45, 47, 160);}.top:hover {background-color: slategray;color: thistle;cursor:pointer}.baidu:link{background-color: turquoise;}.baidu:visited{background-color: rgb(224, 64, 157);}.line::after{content:'hello word';display:block;}</style>
注：/* */w为注释部分，若要执行，请删除/* */
