选择器整理
通常比较熟悉的就不赘述了，主要记录一些不常用但记得不牢的：
*，Element，#id，.class
群组选择器：
.selector1.selector2...selectorN。群组选择器必须全部匹配，即满足所有选择器特征。
层次选择器：
.selector1 .selector2：后代选择器，中间有一个空格；
.selector1>.selector2：子选择器；
.selector1+.selector2：相邻兄弟选择器（.selector2紧位于.selector1后面）；
.selector1~.selector2：通用选择器，匹配.selector1元素后所有匹配.selector2的；
动态伪类选择器：
E:link：未访问的链接；
E:visited：未访问的链接；
E:active：元素被激活，常用于锚点链接，鼠标按下时触发；
E:hover：鼠标悬停在元素上时触发；
E:focus：元素获得焦点时触发；
目标伪类选择器：
E:target，用来匹配文档的URI中某一个标识符的目标元素（手风琴效果）；
UI元素状态伪类选择器（主要用于form表单元素，包含启用，禁用，选中，未选中，获得焦点，失去焦点，锁定和待机等）：
E:checked：匹配所有选中的复选按钮和单选按钮表单元素；
E:enabled：匹配所有启用的表单元素；
E:disabled：匹配所有禁用的表单元素；
结构伪类选择器：
E:first-child：作为父元素的第一个子元素E；
E:last-child：作为父元素的最后一个子元素E；
以上两项比较常用，通常用于处理列表第一个或者最后一个元素特殊的边距问题。
E:root：匹配Element所在文档的跟元素，Html中，根元素始终是html；
E F:nth-child(n)：匹配父元素E的第n个子元素F，n可以是整数，也可以是关键字（even、odd），还可以是公式（2n+1，-n+5），而且n的起始值是0；
E F:nth-last-child(n)：与E F:nth-child(n)顺序相反；
E:first-of-type:选择父元素内具有指定类型的第一个E元素;
E:last-of-type:选择父元素内具有指定类型的最后一个E元素;
E:nth-of-type(n)：选择父元素内具有指定类型的第n个E元素；
E:nth-last-of-type(n)：与E:nth-of-type(n)顺序相反；
E:only-child：匹配父元素只包含一个子元素，且该子元素匹配E元素；
E:only-of-type：匹配父元素只包含一个同类型的子元素，且该子元素匹配E元素；
E:empty：匹配没有子元素的元素，且该元素也不包含任何文本节点；
否定伪类选择器：
E:not(F)：匹配所有除F以外的E元素；
网友评论