八、CSS 3中与用户界面有关的伪类
| 序号 | 选择器 | 含义 |
| 28. | E:enabled | 匹配表单中激活的元素 |
| 29. | E:disabled | 匹配表单中禁用的元素 |
| 30. | E:checked | 匹配表单中被选中的radio(单选框)或checkbox(复选框)元素 |
| 31. | E::selection | 匹配用户当前选中的元素 |
实例:
复制代码
input[type=”text”]:disabled { background:#ddd;}
九、CSS 3中的结构性伪类
| 序号 | 选择器 | 含义 |
| 32. | E:root | 匹配文档的根元素,对于HTML文档,就是HTML元素 |
| 33. | E:nth-child(n) | 匹配其父元素的第n个子元素,第一个编号为1 |
| 34. | E:nth-last-child(n) | 匹配其父元素的倒数第n个子元素,第一个编号为1 |
| 35. | E:nth-of-type(n) | 与:nth-child()作用类似,但是仅匹配使用同种标签的元素 |
| 36. | E:nth-last-of-type(n) | 与:nth-last-child() 作用类似,但是仅匹配使用同种标签的元素 |
| 37. | E:last-child | 匹配父元素的最后一个子元素,等同于:nth-last-child(1) |
| 38. | E:first-of-type | 匹配父元素下使用同种标签的第一个子元素,等同于:nth-of-type(1) |
| 39. | E:last-of-type | 匹配父元素下使用同种标签的最后一个子元素,等同于:nth-last-of-type(1) |
| 40. | E:only-child | 匹配父元素下仅有的一个子元素,等同于:first-child:last-child或 :nth-child(1):nth-last-child(1) |
| 41. | E:only-of-type | 匹配父元素下使用同种标签的唯一一个子元素,等同于:first-of-type:last-of-type或 :nth-of-type(1):nth-last-of-type(1) |
| 42. | E:empty | 匹配一个不包含任何子元素的元素,注意,文本节点也被看作子元素 |
实例:
复制代码
p:nth-child(3) { color:#f00; }
p:nth-child(odd) { color:#f00; }
p:nth-child(even) { color:#f00; }
p:nth-child(3n+0) { color:#f00; }
p:nth-child(3n) { color:#f00; }
tr:nth-child(2n+11) { background:#ff0; }
tr:nth-last-child(2) { background:#ff0; }
p:last-child { background:#ff0; }
p:only-child { background:#ff0; }
p:empty { background:#ff0; }
十、CSS 3的反选伪类
| 序号 | 选择器 | 含义 |
| 43. | E:not(s) | 匹配不符合当前选择器的任何元素 |
实例:
复制代码
:not(p) { border:1px solid #ccc;}










