| 模式 | 含义 | CSS版本 |
|---|---|---|
| * | 匹配任何元素 | 2 |
| E | 匹配E元素 | 1 |
| E[foo] | 匹配包含'foo'属性的E元素 | 2 |
| E[foo="bar"] | 匹配包含'foo'属性并且其值完全等于'bar'的E元素 | 2 |
| E[foo~="bar"] | 匹配包含'foo'属性并且其中一个值是'bar'的E元素 | 2 |
| E[foo^="bar"] | 匹配包含'foo'属性并且值是以'bar'字符开头的E元素 | 3 |
| E[foo$="bar"] | 匹配包含'foo'属性并且值是以'bar'字符结束的E元素 | 3 |
| E[foo*="bar"] | 匹配包含'foo'属性并且值包含'bar'字符的E元素 | 3 |
| E[foo|="en"] | 匹配包含'foo'属性具有多个连字号分隔（hyphen-separated）的值、其中一个值以'en'开头的E元素，主要用于lang属性，比如"en"、"en-us"、"en-gb"等等 | 2 |
| E:root | 匹配文档的根元素，对于HTML文档，就是HTML元素 | 3 |
| E:nth-child(n) | 匹配其父元素的第n个子元素，第一个编号为1 | 3 |
| E:nth-last-child(n) | 匹配其父元素的倒数第n个子元素，第一个编号为1 | 3 |
| E:nth-of-type(n) | 与:nth-child()作用类似，但是仅匹配使用同种标签的元素 | 3 |
| E:nth-last-of-type(n) | 与:nth-last-child() 作用类似，但是仅匹配使用同种标签的元素 | 3 |
| E:first-child | 匹配父元素的第一个子元素，等同于:nth-last-child(1) | 2 |
| E:last-child | 匹配父元素的最后一个子元素，等同于:nth-last-child(1) | 3 |
| E:first-of-type | 匹配父元素下使用同种标签的第一个子元素，等同于:nth-of-type(1) | 3 |
| E:last-of-type | 匹配父元素下使用同种标签的最后一个子元素，等同于:nth-last-of-type(1) | 3 |
| E:only-child | 匹配父元素下仅有的一个子元素，等同于:first-child:last-child或 :nth-child(1):nth-last-child(1) | 3 |
| E:only-of-type | 匹配父元素下使用同种标签的唯一一个子元素，等同于:first-of-type:last-of-type或 :nth-of-type(1):nth-last-of-type(1) | 3 |
| E:empty | 匹配一个不包含任何子元素的元素，注意，文本节点也被看作子元素 | 3 |
| E:link | 匹配所有未被点击的链接 | 1 |
| E:visited | 匹配所有已被点击的链接 | 1 |
| E:active | 匹配鼠标已经其上按下、还没有释放的E元素 | 1 和 2 |
| E:hover | 匹配鼠标悬停其上的E元素 | 1 和 2 |
| E:focus | 匹配获得当前焦点的E元素 | 1 和 2 |
| E:target | 匹配文档中特定"id"点击后的效果 | 3 |
| E:lang(fr) | 匹配lang属性等于'fr'的E元素 | 2 |
| E:enabled | 匹配表单中激活的元素 | 3 |
| E:disabled | 匹配表单中禁用的元素 | 3 |
| E:checked | 匹配表单中被选中的radio（单选框）或checkbox（复选框）元素 | 3 |
| E::first-line | 匹配E元素的第一行 | 1 |
| E::first-letter | 匹配E元素的第一个字母 | 1 |
| E::before | 在E元素之前插入生成的内容 | 2 |
| E::after | 在E元素之后插入生成的内容 | 2 |
| E.warning | an E element whose class is "warning" (the document language specifies how class is determined). |
1 |
| E#myid | 匹配ID等于myid的E元素 | 1 |
| E:not(s) | 匹配不符合s选择器的E元素 | 3 |
| E F | E元素下的所有F元素 | 1 |
| E > F | E元素下的F子元素 | 2 |
| E + F | 匹配所有紧随E元素之后的同级元素F | 2 |
| E ~ F | 匹配任何在E元素之后的同级F元素 | 3 |
nth-child、从父元素下的所有子元素中按序号选择：
tr:nth-child(2n+1) /* 匹配表格的基数行 */tr:nth-child(odd) /* 一样 */
tr:nth-child(2n+0) /* 匹配表格的偶数行 */
tr:nth-child(even) /* 一样 */
:nth-child(10n-1) /* 匹配第9个，19个，29个等等元素 */
:nth-child(10n+9) /* 一样 */
foo:nth-child(0n+5) /* 匹配foo元素的父元素下的第5个元素 */
foo:nth-child(5) /* 一样*/
html|tr:nth-child(-n+6) /* 匹配表格的前6行 */
nth-last-child、从父元素下的所有子元素中按序号从最后开始选择：
tr:nth-last-child(-n+2) /* 匹配表格的最后两行 */foo:nth-last-child(odd) /* 从最后一个开始匹配基数行 */
nth-of-type、从父元素下的指定的子元素中按序号选择：
img:nth-of-type(2n+1) /* 匹配基数行的图片元素 */img:nth-of-type(odd) /* 一样 */
