1：多个选择器
h1, h2 {} ——h1或h2标签的所有元素
2：通配选择器
* {} ——所有元素
3：元素选择器
div {} ——所有div元素
4：类选择器
.test {} ——class属性为test的所有元素
p.test {} ——class属性为test的所有p元素
.test.test1 {} ——class属性有test、test1两个值的所有元素，包含有test、test1的三个值以上的也匹配
5：ID选择器
#test {} ——id属性为test的元素
6：属性选择器
*[title] {} ——有title属性的所有元素
p[class] {} ——有class属性的所有p元素
a[href][title] {} ——同时有href与title属性的所有a元素
a[href="ddd"] ——所有href属性值为"ddd/"的a元素
a[href="dd"][title="dd"] ——所有href属性值为"dd"且title为"dd"的a元素
p[class~="test4"] {} ——class属性值包含test4的所有p元素，对应的如class=“test test4”这样类型的会被包含
p[class^="test4"] {} ——class属性值以test4开头的所有p元素
p[class$="test4"] {} ——class属性值以test4结尾的所有p元素
p[class*="test444"] {} ——class属性值包含字串test4的所有p元素 ，对应的若有class="test44"]这样类型的会被包含
7：后代选择器
div span{} ——div元素下的所有span元素，即div可以是span的父辈，祖父辈等
div > span {} ——div元素下的所有span子元素，即span只能是div的子辈
div + span{} ——为div相邻兄弟的所有span元素，即div与span有同一父辈，且div在前
8：伪类选择器
a:link{} ——未访问过的a元素
a:visited{} ——已访问过的a元素
9：动态伪类
元素:focus{} ——指当前拥有输入焦点的元素，即接收键盘输入等方式激活的元素
元素:hover{} ——指鼠标停留的元素
元素:active{} ——指鼠标激活的元素，如点击链接或按钮的那一刻的元素样式
p:first-child{} ——指第一个p元素，不是p的第一个子元素
lang(){} ——括号内为语言，指的是某种语言下样式
10：伪元素选择器
p:first-letter{} ——指p元素段内的第一个字母
p:first-line{} ——指p元素段内的第一行
p:before{} ——指在p元素前面设置的样式，此处可添加内容以及对应样式
p:after{} ——指在p元素后面设置的样式，此处可添加内容以及对应样式
伪元素只能用于标记或段落类的块级元素，不能用于行内元素； 伪元素必须放在选择题主体后
css篇：关于选择器
原文地址：https://www.cnblogs.com/tianshu/p/9162896.html