| 基础 | ||
|---|---|---|
| 该标签的每个元素。 | button { } | |
| 带有该类的元素。 | .active { } | |
| 带有该 id 的唯一元素。 | #header { } | |
| 所有元素。 | * { box-sizing: border-box; } | |
| 文档根元素;放置全局自定义属性的惯用位置。 | :root { --gap: 1rem; } | |
| 匹配 A 或 B 的元素(分组)。 | h1, h2, h3 { } | |
| 组合器 | ||
| 任何作为 A 后代的 B。 | nav a { } | |
| 作为 A 直接子元素的 B。 | ul > li { } | |
| 紧跟在 A 之后的 B,同一父元素。 | h1 + p { } | |
| 同一父元素中位于 A 之后的每个 B。 | h1 ~ p { } | |
| 伪类(状态) | ||
| 指针悬停其上时的元素。 | a:hover { } | |
| 持有键盘焦点的元素。 | input:focus { } | |
| 作为父元素第一个子元素的元素。 | li:first-child { } | |
| 第 n 个子元素;接受 2n 这样的公式。 | tr:nth-child(2n) { } | |
| 不匹配任何内部选择器的元素;自 Selectors 4 起接受列表。 | li:not(:first-child, .skip) { } | |
| 被选中的复选框、单选框或选项。 | input:checked { } | |
| 被禁用的输入框或按钮。 | button:disabled { } | |
| 包含与内部选择器匹配元素的父元素。 | li:has(ul) { } | |
| 列表中的任意选择器;优先级取列表中最高的。 | :is(ol, ul) li { } | |
| 与 :is() 相同,但优先级为零。 | :where(ol, ul) li { } | |
| 应显示焦点环的焦点,通常来自键盘。 | a:focus-visible { } | |
| 自身或后代持有焦点的元素。 | form:focus-within { } | |
| 作为父元素最后一个子元素的元素。 | li:last-child { } | |
| 没有兄弟元素的元素。 | p:only-child { } | |
| 同标签的第 n 个兄弟元素;接受 2n 这样的公式。 | p:nth-of-type(2n) { } | |
| 同标签的第一个或最后一个兄弟元素。 | p:first-of-type { } | |
| 没有子元素也没有文本的元素。 | td:empty { } | |
| 未访问的链接和已访问的链接。 | a:visited { } | |
| 标记为必填的输入和留作可选的输入。 | input:required { } | |
| 值通过或未通过其校验规则的输入。 | input:invalid { } | |
| 用户无法编辑的输入。 | input:read-only { } | |
| id 与 URL 片段匹配的元素。 | #note:target { } | |
| 预选的选项或一组的默认按钮。 | input:default { } | |
| 被脚本设为不确定状态的复选框。 | input:indeterminate { } | |
| 任何内置元素,或注册之后的自定义元素。 | my-widget:defined { } | |
| 使用指定语言的元素。 | p:lang(fr) { } | |
| 伪元素 | ||
| 元素之前生成的内容节点。 | label::before { content: ""; } | |
| 元素之后生成的内容节点。 | code::after { content: ";"; } | |
| 文本块的第一个字母。 | p::first-letter { } | |
| 输入框的占位文本。 | input::placeholder { } | |
| 文本块的第一行。 | p::first-line { } | |
| 用户选中的文本。 | ::selection { } | |
| 列表项的项目符号或编号。 | li::marker { } | |
| 全屏元素或对话框后面的区域。 | dialog::backdrop { } | |
| 文件输入内部的浏览按钮。 | input::file-selector-button { } | |
| 宿主已暴露的 shadow-DOM 部分。 | my-widget::part(header) { } | |
| 属性选择器 | ||
| 拥有该属性的元素,值不限。 | [required] { } | |
| 属性恰好等于 val。 | [type="submit"] { } | |
| 属性以 val 开头。 | a[href^="https"] { } | |
| 属性以 val 结尾。 | a[href$=".pdf"] { } | |
| 属性包含 val。 | a[href*="login"] { } | |
| 包含 val 的空格分隔列表。 | [class~="badge"] { } | |
| 值等于 val,或以 val 加连字符开头。 | [lang|="en"] { } | |