css3选择器归总
浏览数：22 /
时间：2015年06月09日
同级元素通用选择器（同级）：A~B，只要B在A的后面，A就可以匹配到B；例如：p~ul，选择前面有p元素的每个ul元素。
临近选择器（同级）：A+B，A和B必须是邻近的；例如：div+p，选择紧接在div元素之后的所有p元素。
子选择器：A>B,A只能匹配自己的儿子，匹配不到A的孙子辈；例如：div>p，选择父元素为div元素的所有p元素。
属性选择器：有四种，input是最常用这个选择器的标签。
第一种：E[att^=”val”]，属性att的值以”val”开头的元素。
第二种：E[att$=”val”] ，属性att的值以”val”结尾的元素。
第三种：E[att*=”val”] ，属性att的值包含”val”字符串的元素。
第四种：E[att=”val”]，属性att的值是”val“元素。
伪类选择器：
与用户界面有关的伪类（:enabled，:disabled（常用），:checked，::selection）：
E:enabled，匹配表单中激活的元素
表单中可操作的元素。同disabled。
E:disabled， 匹配表单中禁用的元素
disabled="disabled"，input[type="text"]:disabled {
background:#ddd;}。
E:checked,
匹配表单中被选中的radio（单选框）或checkbox（复选框）元素。同disabled。
::selection， 匹配用户当前选中的元素，
::selection{background:#ddd;}。前面不加元素。
结构性伪类（:root ，E:nth-child(n) ，E:nth-last-child(n)
，E:last-child
），支持｛:nth-child(2n)，:nth-child(2n+1)，:nth-child(3n)，:nth-child(3n+2)这种数学公式｝
:root
匹配文档的根元素，对于HTML文档，就是HTML元素。前面不加元素。
E:nth-child(n)，
匹配其父元素的第n个子元素；例如：p:nth-child(2),选择属于其父元素的第二个子元素的每个p元素。
E:nth-last-child(n)
，匹配其父元素的倒数第n个子元素；例如：p:nth-last-child(2),选择属于其父元素的倒数第二个子元素的每个p元素。
E:last-child，
匹配父元素的最后一个子元素，等同于:nth-last-child(1)；例如：p:last-child,选择属于其父元素最后一个子元素的每个p元素。
E:nth-of-type(n)，与:nth-child()作用类似，但是仅匹配使用同种标签的元素。例如：p:nth-of-type(2),选择属于其父元素第二个子p元素的每个p元素。
E:nth-last-of-type(n)， 与:nth-last-child()
作用类似，但是仅匹配使用同种标签的元素 。例如：p:nth-last-of-type(2),选择属于其父元素倒数第二个子p元素的每个p元素。
E:first-of-type，
匹配父元素下使用同种标签的第一个子元素，等同于:nth-of-type(1)；例如：p:last-of-type,选择属于其父元素的首个p元素的每个p元素。
E:last-of-type，
匹配父元素下使用同种标签的最后一个子元素，等同于:nth-last-of-type(1)；例如：p:last-of-type,选择属于其父元素的最后一个p元素的每个p元素。
E:only-child
，匹配父级元素只有一个子元素的元素；例如：p:only-child,选择属于其父元素的唯一一个元素的每个p元素。
E:only-of-type
匹配父元素下使用同种标签的唯一一个子元素，等同于:first-of-type:last-of-type或
:nth-of-type(1):nth-last-of-type(1) 。例如：p:only-of-type,选择属于其父元素唯一的p元素的每个p元素。
E:empty
匹配一个不包含任何子元素的元素，注意，文本节点也被看作子元素.,空白节点也被看做子节点。例如：p:empty ,选择没有子元素的每个p元素（包括文本节点）。
反选伪类选择器：（E:not(s) ）
:not(s) ，匹配不符合当前选择器的任何元素
:not(:nth-child(1))。前面不加元素；例如:
:not(p) ,选择非p元素的每个元素。
:focus
选择器：
E:focus，选取获得焦点的元素。例如:input：focus ,选择选择获得焦点的input元素。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
