css3新增选择器有哪些

1

E:root

匹配文档的根元素，对于HTML文档，就是HTML元素

2

E:nth-child(n)

匹配其父元素的第n个子元素，第一个编号为1

p:nth-child(3) { color:#f00; }

3

E:nth-last-child(n)

匹配其父元素的倒数第n个子元素，第一个编号为1

p:last-child { background:#ff0; }

4

E:nth-of-type(n)

与:nth-child()作用类似，但是仅匹配使用同种标签的元素

p:nth-of-type(2){color:red;}选择父元素的第n个子元素p

5

E:nth-last-of-type(n)

与:nth-last-child() 作用类似，但是仅匹配使用同种标签的元素

6

E:last-child

匹配父元素的最后一个子元素，等同于:nth-last-child(1)

7

E:first-of-type

匹配父元素下使用同种标签的第一个子元素，等同于:nth-of-type(1)

8

E:last-of-type

匹配父元素下使用同种标签的最后一个子元素，等同于:nth-last-of-type(1)

9

E:only-child

匹配父元素下仅有的一个子元素，等同于:first-child:last-child或 :nth-child(1):nth-last-child(1)

p:only-child { background:#ff0; }

10

E:only-of-type

匹配父元素下使用同种标签的唯一一个子元素，等同于:first-of-type:last-of-type或 :nth-of-type(1):nth-last-of-type(1)

11

E:empty

匹配一个不包含任何子元素的元素，注意，文本节点也被看作子元素

p:empty { background:#ff0; }

1

E:enabled

匹配表单中激活的元素

2

E:disabled

匹配表单中禁用的元素

input[type="text"]:disabled { background:#ddd; }

3

E:checked

匹配表单中被选中的radio（单选框）或checkbox（复选框）元素

4

E::selection

匹配用户当前选中的元素

1

E ~ F

匹配任何在E元素之后的同级F元素

p ~ ul { background:#ff0; }

1

E:not(s)

匹配不符合当前选择器的任何元素

:not(p) { border:1px solid #ccc; }

1

E:target

匹配文档中特定"id"点击后的效果