CSS选择器:
基础选择器:
* 匹配所有的选择器
E 标签选择器p,header,aside
.info class选择器
#info id选择器
关系选择器:(相邻兄弟选择器)
E+F 紧贴着E的元素第一个元素,即F
E~F E后面的所有兄弟节点都生效
E F 包含元素
E>F 指定E的子元素F
伪对象选择器:(可以精确选择文本和元素前后元素)
E::first-letter 选择文本的第一个元素
E::first-line 选择文本的第一行元素
E::before 选择所选E元素的前一个标签
E::after 选择所选E元素的后一个标签
E::selection 鼠标选中的元素的样式
结构伪类选择器:(可以精确选择一个父元素对应多个子元素的组合)
从爸爸来找儿子的关系:
E:nth-child(n) 选择E元素的爸爸的子元素,
E:first-child 选择E元素的爸爸的第一个儿子(子元素)
E:last-child 选择E元素的爸爸的最后一个儿子(子元素)
E:only-child 选择E元素的爸爸的唯一个儿子(子元素),只有当时独生子女才会被选中,如果爸爸有多个儿子就不会被选择
从元素的兄弟找关系:
E:nth-of-type 选择E作为节点找兄弟,包括自己
E:first-of-type 选择E作为节点找第一个兄弟
E:last-of-type 选择E作为节点找最后一个兄弟
E:only-of-type 选择E作为节点找唯一一个E,只有当是独生子女才会被选中
UI元素状态伪类选择器:
E:checked 被选中
E:enable 文本框允许使用
E:disabled 文本框禁止使用