一、基础选择器
1、通配选择器 *
2、元素选择器E
3、ID选择器 #id
4、CLASS.class
5、群组选择器E,F
二、层次选择器
1、后代选择器E F
2、子选择器E>F
3、相邻选择器E+F
4、通用兄弟选择器E~F
三、属性选择器
1、E[attr]选择具有att属性的E元素
2、E[attr="val"]选择具有att属性且属性值等于val的E元素。
3、E[attr~="val"]选择具有att属性且属性值为一用空格分隔的字词列表,其中一个等于val的E元素
(包含只有一个值且该值等于val的情况)。
4、E[attr^="val"]选择具有att属性且属性值为以val开头的字符串的E元素。
5、E[attr$="val"]选择具有att属性且属性值为以val结尾的字符串的E元素。
6、E[attr*="val"]选择具有att属性且属性值为包含val的字符串的E元素。
7、E[attr|="val"]选择具有att属性且属性值为以val开头并用连接符"-"分隔的字符串的E元素,如果属性值仅为val,也将被选择。
四、伪类选择器
1、动态伪类选择器E:link/E:visited/E:hover/E:active/E:focus
2、目标伪类选择器E:target匹配相关URL指向的E元素
3、语言伪类选择器
4、UI元素伪类选择器
5、结构伪类选择器
E:root匹配E元素在文档的根元素。在HTML中,根元素永远是HTML
E:first-child匹配父元素的第一个子元素E。
E:last-child匹配父元素的最后一个子元素E。
E:only-child匹配父元素仅有的一个子元素E。
E:nth-child(n)匹配父元素的第n个子元素E,假设该子元素不是E,则选择符无效。
E:nth-last-child(n)匹配父元素的倒数第n个子元素E,假设该子元素不是E,则选择符无效。
E:first-of-type匹配同类型中的第一个同级兄弟元素E
E:last-of-type匹配同类型中的最后一个同级兄弟元素E
E:only--of-type匹配同类型中的唯一的一个同级兄弟元素E
E:nth-of-type(n)匹配同类型中的第n个同级兄弟元素E
E:nth-last-of-type(n)匹配同类型中的倒数第n个同级兄弟元素E
E:empty匹配没有任何子元素(包括text节点)的元素E
五、伪元素选择器
1、E:first-letter设置对象内的第一个字符的样式。
2、E:first-line设置对象内的第一行的样式。
3、E:before设置在对象前(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用
4、E:after设置在对象后(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用
5、E::placeholder设置对象文字占位符的样式。
6、E::selection设置对象被选择时的样式。