CSS选择器归类举例
类 id 元素选择器
<li class="red">1</li>
<li id="blue">2</li>
<li class="red">3</li>
<li>4</li>
<style>
.red{color:red;}
#blue{color:blue;}
li{color:green;}
*{font-size:16px;}
</style>
伪类选择器
<a href="https://www.baidu.com">链接</a>
<style>
a:link{color:blue;}
a:visited{color:grey;}
a:hover{color:red;}
a:active{color:yellow;}
</style>
且
E:focus
E:not()
E:empty
E:checked
E:enabled
E:disabled
E:first-child 同一层排行第一
E:nth-child(n)
E:nth-last-child(n)
E:last-child
E:only-child
E:first-of-type 同一层细分领域第一
E:nth-child(n)
E:nth-last-child(n)
E:last-of-type
E:only-of-type
伪元素选择器
内的
E::first-letter E内的第一个字母
E::first-line E内的第一行
E::before E内的最前面
E::after E内的最后面
属性选择器
^开始 $结尾 *包含
E[att]
E[att="val"]
E[att^="val"]
E[att$="val"]
E[att*="val"]
包含val并用空格分隔
E[att~="val"]
以val开头并用连接符"-"分隔
E[att|="val"]
这是我的签名