学习笔记--CSS选择器

CSS选择器：

1）元素选择器：1.id选择器，2.类选择器，3.标签选择器，4.通配符选择器
2）关系选择器：1.包含关系 E F （E的所有F后代）2.子代选择 E<F （只包含子代）3.相邻选择器 E+F （相邻元素，隔一个就不算）4.兄弟选择器 E~F（兄弟元素）
3）属性选择器：1.e[att] （有属性att的元素） 2.e[att=“val”] （属性att值为val）3.e[att~=“val”]（属性att具有val值，多个属性值时） 4.e[att^=“val”] （属性值以val开头）5.e[att$=“val”] （属性值以val结尾）6.e[att*=“val”] （属性值中具有val字符串）7.e[att|=“val”] （属性值为val或者val- 开头）
4）伪类选择器：针对元素特性定义的类，不需要手动定义。a:link,a:visited,a:hover,a:active,a:focus,a:first-child,…
5）伪元素选择器：e:before ,e:after …

CSS选择器优先级：

！important > 内联样式 > id > 属性=类=伪类 > 元素=伪元素=关系 > 通配符 > 继承 > 浏览器默认属性
内联样式 特殊性：1000
id 特殊性：100
属性=类=伪类 特殊性：10
元素=伪元素=关系 特殊性：1
通配符 特殊性：0
继承 特殊性：null
多个选择器可根据特殊性相加来判断优先级

CSS选择器的解析顺序

CSS选择器从右往左解析
优点：减少CSS解析节点；从右往左解析寻找的都是父节点，无需等待
https://blog.csdn.net/jinboker/article/details/52126021