此速查表译自:W3C Selectors Level 3
对于每一种选择器,都添加了由 Mozilla 提供的详细说明页面的直达链接。
模式 | 描述 | 释义 |
---|---|---|
* | 通配选择符 | 任意元素。 |
E | 标签选择器 | 任意标签为 E 的元素。 |
E.warning | 类选择器 | 一个 E 元素,其类为“warning”(文档语言决定如何判断类)。 |
E#myid | ID 选择器 | 一个 E 元素,其 ID 等于“myid”。 |
E[foo] | 属性选择器 | 一个 E 元素,其拥有“foo”属性的。 |
E[foo="bar"] | 属性选择器 | 一个 E 元素,其“foo”属性的值完全等于“bar”。 |
E[foo~="bar"] | 属性选择器 | 一个 E 元素,其“foo”属性的值是一个以空白字符分割的列表,其中一个元素完全等于“bar”。 |
E[foo^="bar"] | 属性选择器 | 一个 E 元素,其“foo”属性的值以字符串“bar”开始。 |
E[foo$="bar"] | 属性选择器 | 一个 E 元素,其“foo”属性的值以字符串“bar”结束。 |
E[foo*="bar"] | 属性选择器 | 一个 E 元素,其“foo”属性的值包含子字符串“bar” |
[E[foo | ="en"]](https://developer.mozilla.org/zh-CN/docs/Web/CSS/Attribute_selectors) | 属性选择器 |
E:root | 结构伪类 | 一个 E 元素,且为文档的根。 |
E:nth-child(n) | 结构伪类 | 一个 E 元素,且为其父亲的第 n 个孩子。 |
E:nth-last-child(n) | 结构伪类 | 一个 E 元素,且从其父亲的最后一个孩子开始计数,为其父亲的第 n 个孩子。 |
E:nth-of-type(n) | 结构伪类 | 一个 E 元素,且为该类型的第 n 个兄弟。 |
E:nth-last-of-type(n) | 结构伪类 | 一个 E 元素,且从该类型的最后一个兄弟开始计数,为该类型的第 n 个兄弟。 |
E:first-child | 结构伪类 | 一个 E 元素,且为其父亲的第一个孩子。 |
E:last-child | 结构伪类 | 一个 E 元素,且为其父亲的最后一个孩子。 |
E:first-of-type | 结构伪类 | 一个 E 元素,且为该类型的第一个兄弟。 |
E:last-of-type | 结构伪类 | 一个 E 元素,且为该类型的最后一个兄弟。 |
E:only-child | 结构伪类 | 一个 E 元素,且为其父亲的唯一一个孩子。 |
E:only-of-type | 结构伪类 | 一个 E 元素,且为该类型的唯一一个兄弟。 |
E:empty | 结构伪类 | 一个 E 元素,且其不包含孩子(包含 Text 节点) |
E:link | 链接伪类 | 一个 E 元素,且其为一个尚未被访问(:link)或已经被访问(:visited)的超链接的源锚点。 |
E:active | 用户操作伪类 | 一个 E 元素,且其处于某一用户操作期间。 |
E:target | 目标伪类 | 一个 E 元素,且其为引用 URI 的目标。 |
E:lang(fr) | 语言伪类 | 一个类型为 E,语言为“fr”的元素(文档语言决定如何判断其语言)。 |
E:enabled | UI 元素状态伪类 | 一个用户界面元素 E,其可用或者被禁用。 |
E:checked | UI 元素状态伪类 | 一个用户界面元素 E,其被选中(例如单选按钮或复选框)。 |
E::first-line | 首行伪元素 | E 元素的第一个有格式的行。 |
E::first-letter | 首字母伪元素 | E 元素的第一个有格式的字母。 |
E::before | 前置伪元素 | 在 E 元素之前产生的内容。 |
E::after | 后置伪元素 | 在 E 元素之后产生的内容。 |
E:not(s) | 否定伪类 | 一个 E 元素,其不匹配简单的选择器 s。 |
E F | 后裔组合 | 一个 F 元素,且其为 E 元素的后裔。 |
E > F | 孩子组合 | 一个 F 元素,且其为 E 元素的孩子。 |
E + F | 相邻兄弟组合 | 一个 F 元素,且其紧紧跟随 E 元素。 |
E ~ F | 一般兄弟组合 | 一个 F 元素,且其跟随 E 元素。 |
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于