CSS选择器 (Selector )

Selector 语法:

选择器语法 说明 部分 等级
* 任何元素 § 5.2 通用选择器 2
E E 型元素 § 5.1 类型(标签名称)选择器 1
E:not(s1, s2, …) 与复合选择器 s1或复合选择器 s2都不匹配的 E 元素 § 4.3 否定(无匹配)伪类::not() 3/4
E:is(s1, s2, …) 匹配复合选择器 s1和/或复合选择器 s2的 E 元素 § 4.2 Matches-Any Pseudo-class: :is() 4
E:where(s1, s2, …) 匹配复合选择器 s1和/或复合选择器 s2但不提供特异性 的 E 元素。 § 4.4 特异性调整伪类::where() 4
E:has(rs1, rs2, …) 一个 E 元素,如果相对选择器 rs1或rs2中的任何一个,当使用 E 作为:scope 元素进行评估时,匹配一个元素 § 4.5 关系伪类::has() 4
E.warning 属于类的 E 元素warning(文档语言指定如何确定类)。 § 6.6 类选择器 1
E#myid ID 等于 的 E 元素myid § 6.7 ID 选择器 1
E[foo] 具有foo属性 的 E 元素 § 6.1 属性存在和值选择器 2
E[foo="bar"] 一个 E 元素,其foo属性值正好等于bar § 6.1 属性存在和值选择器 2
E[foo="bar" i] 一个 E 元素,其foo属性值完全等于任何(ASCII 范围)大小写排列bar § 6.3 区分大小写 4
E[foo="bar" s] 一个 E 元素,其foo属性值等于bar § 6.3 区分大小写 4
E[foo~="bar"] 一个 E 元素,其foo属性值是由空格分隔的值的列表,其中一个值完全等于bar § 6.1 属性存在和值选择器 2
E[foo^="bar"] 一个 E 元素,其foo属性值正好以字符串开头bar § 6.2 子串匹配属性选择器 3
E[foo$="bar"] 一个 E 元素,其foo属性值正好以字符串结尾bar § 6.2 子串匹配属性选择器 3
E[foo*="bar"] 一个 E 元素,其foo属性值包含子字符串bar § 6.2 子串匹配属性选择器 3
E[foo|="en"] 一个 E 元素,其foo属性值是以连字符分隔的值列表en § 6.1 属性存在和值选择器 2
E:dir(ltr) 具有从左到右方向性的 E 类型元素(文档语言指定如何确定方向性) § 7.1 方向性伪类::dir() 4
E:lang(zh, "*-hant") 一个 E 类型的元素,标记为中文(任何方言或书写系统)或以其他方式用繁体汉字书写 § 7.2 语言伪类::lang() 2/4
E:any-link 一个 E 元素是超链接的源锚 § 8.1 超链接伪类: :any-link 4
E:link 一个 E 元素是目标尚未访问的超链接的源锚点 § 8.2 链接历史伪类::link 和 :visited 1
E:visited 一个 E 元素是一个超链接的源锚,其目标已经被访问过 § 8.2 链接历史伪类::link 和 :visited 1
E:local-link E 元素是指向当前 URL 的超链接的源锚 § 8.3 本地链接伪类: :local-link 4
E:target E 元素是当前 URL 的目标 § 8.4 目标伪类: :target 3
E:target-within 一个 E 元素,它是当前 URL 的目标,或者包含一个这样做的元素。 § 8.5 目标容器伪类::target-within 4
E:scope 一个 E 元素是一个指定的参考元素 § 8.6 参考元素伪类::scope 4
E:current 当前呈现在时间维度画布中的 E 元素 § 10.1 当前元素伪类: :current 4
E:current(s) 最深的 E 元素:匹配选择器s 的当前元素 § 10.1 当前元素伪类: :current 4
E:past 过去在时间维度画布中的 E 元素 § 10.2 过去元素伪类::past 4
E:future 时间维度画布中未来的 E 元素 § 10.3 未来元素伪类: :future 4
E:active 处于激活状态的 E 元素 § 9.2 激活伪类: :active 1
E:hover 光标下的 E 元素,或光标下有后代的 E 元素 § 9.1 指针悬停伪类::hover 2
E:focus 具有用户输入焦点的 E 元素 § 9.3 输入焦点伪类: :focus 2
E:focus-within 具有用户输入焦点或包含具有输入焦点的元素的 E 元素。 § 9.5 焦点容器伪类::focus-within 4
E:focus-visible 具有用户输入焦点的 E 元素,并且 UA 已确定应为该元素绘制焦点环或其他指示符 § 9.4 焦点指示伪类::focus-visible 4
E:enabledE:disabled 分别启用或禁用的用户界面元素 E § 12.1.1 :enabled 和 :disabled 伪类 3
E:read-writeE:read-only 用户可更改或不可更改的用户界面元素 E § 12.1.2 可变性伪类::read-only 和 :read-write 3-UI/4
E:placeholder-shown 当前显示占位符文本的输入控件 § 12.1.3 占位符显示的伪类::placeholder-shown 3-UI/4
E:default 用户界面元素 E,它是一组相关选项中的默认项 § 12.1.4 默认选项伪类::默认 3-UI/4
E:checked 选中/选中的用户界面元素 E(例如单选按钮或复选框) § 12.2.1 选择选项伪类: :checked 3
E:indeterminate 处于不确定状态(既未选中也未选中)的用户界面元素 E § 12.2.2 不确定值伪类: :indeterminate 4
E:validE:invalid 满足或不满足其数据有效性语义的用户输入元素 E § 12.3.2 有效性伪类::valid 和 :invalid 3-UI/4
E:in-rangeE:out-of-range 用户输入元素 E,其值在范围内/范围外 § 12.3.3 范围伪类::in-range 和 :out-of-range 3-UI/4
E:requiredE:optional 需要/不需要输入的用户输入元素 E § 12.3.4 可选性伪类::required 和 :optional 3-UI/4
E:blank 值为空白的用户输入元素 E(空/缺失) § 12.3.1 空值伪类: :blank 4
E:user-invalid 用户更改的用户输入元素 E 输入不正确(无效、超出范围、省略但需要) § 12.3.5 用户交互伪类::user-valid 和 :user-invalid 4
E:root 一个 E 元素,文档的根 § 13.1:根伪类 3
E:empty 一个没有子元素(既没有元素也没有文本)的 E 元素,可能除了空白 § 13.2:空的伪类 3
E:nth-child(n [of S]?) 一个 E 元素,其父元素匹配S的第n个子元素 § 13.3.1 :nth-child() 伪类 3/4
E:nth-last-child(n [of S]?) 一个 E 元素,其父元素匹配S的第n个子元素,从最后一个元素开始计数 § 13.3.2 :nth-last-child() 伪类 3/4
E:first-child 一个 E 元素,其父元素的第一个子元素 § 13.3.3 :first-child 伪类 2
E:last-child 一个 E 元素,其父元素的最后一个子元素 § 13.3.4 :last-child 伪类 3
E:only-child 一个 E 元素,其父元素的唯一子元素 § 13.3.5:独生子伪类 3
E:nth-of-type(n) 一个 E 元素,其类型的第n个兄弟 元素 § 13.4.1 :nth-of-type() 伪类 3
E:nth-last-of-type(n) 一个 E 元素,其类型的第n个兄弟元素,从最后一个开始计数 § 13.4.2 :nth-last-of-type() 伪类 3
E:first-of-type 一个 E 元素,其类型的第一个兄弟元素 § 13.4.3:第一类伪类 3
E:last-of-type 一个 E 元素,其类型的最后一个兄弟元素 § 13.4.4 :last-of-type 伪类 3
E:only-of-type 一个 E 元素,只有其类型的同级元素 § 13.4.5 :only-of-type 伪类 3
E F E 元素的 F 元素后代 § 14.1 后代组合子 ( ) 1
E > F E 元素的 F 元素子元素 § 14.2 子组合子 (>) 2
E + F 紧跟在 E 元素之前的 F 元素 § 14.3 下一个兄弟组合子 (+) 2
E ~ F 前面有一个 E 元素的 F 元素 § 14.4 后续兄弟组合子 (~) 3
F || E 一个 E 元素,表示网格/表格中的一个单元格,该单元格属于由元素 F 表示的列 § 15.1 列组合符 (||) 4
E:nth-col(n) 一个 E 元素,表示属于网格/表格中第n列的 单元格 § 15.2 :nth-col() 伪类 4
E:nth-last-col(n) 一个 E 元素,表示属于网格/表格中第n列的单元格,从最后一个开始计数 § 15.3 :nth-last-col() 伪类 4

注意:[CSS3UI]中引入了一些 4 级选择器(上面称为“3-UI”)。

来源:https://drafts.csswg.org/selectors-4