正确使用选择器部分和部分的术语

小编典典

正确使用选择器部分和部分的术语

css

用逗号分隔 的CSS选择器部分的正确术语是什么？

    body.foo .login , body.bar .login { ... }
/*                  |
           Part 1   |  Part 2         */

在这些部分，什么是部分术语 通过组合子分隔 （空格，+，>，等）？

    body.foo .login , ... { ... }
/*          |
   Part 1   |   Part 2    */

阅读 328

2020-05-16

共1个答案

小编典典

用逗号分隔 的CSS选择器部分的正确术语是什么？

这些称为复杂选择器 。整个逗号分隔的列表称为
选择器列表 。

在这些部分，什么是部分术语 通过组合子分隔 （空格，+，>，等）？

这些被称为复合选择器。

因此，选择器列表由一个或多个用逗号分隔的复杂选择器组成，每个复杂选择器都由两个主要部分组成：复合选择器和组合器。它还可以选择包含伪元素。

复合选择器曾经有个相当复杂的名称“简单选择器序列”。更糟糕的是，复杂的选择器仅被称为“选择器”。不用说，我建议使用新术语，因为与它们的前任相比，它们要简单得多，麻烦得多并且完全明确。

由于我在这里，所以这里是其余的定义…

一个 简单的选择器 是 选择器 的基本组成部分。它是以下任意一项：
- 通用选择器（*），可以选择使用名称空间
- 型选择器（a，div，span，ul，li，等），任选地与一个命名空间
- 属性选择器（[att]，[att=val]等），可以选择使用名称空间
- 类选择器（.class）
- ID选择器（#id）
- 伪类（:pseudo-class）
- 如上所述， 复合选择器 （以前称为“简单选择器序列”）是不由组合器分隔的一连串简单选择器：
  
  a:not([rel=”external”]):hover
一个 组合子 是选择的另一个基本组成部分。它是分隔两个复合选择器的符号或标记，在其位置上建立了由两个复合选择器表示的两个元素之间的关系。当前有四种组合器正在使用：
- 后代组合器：
```
    article p
```
- 子组合器：
```
    /*
```
  - The extra spaces in between are whitespace,
  - and are therefore insignificant.
    */
    ul > li
- 相邻的同级组合器：
```
    header + section
```
- 通用同级组合器：
```
    h2 ~ p
```

在以后的规范中可能会引入更多的组合器。

而一个 复杂的选择 （以前只是“选择”）是由组合程序连接的化合物选择的由一个完整的字符串：
```
nav[role="main"] > ul:first-child > li
```
复杂选择器的主题是它的最后一个或唯一的复合选择器，代表将被匹配或设置样式的元素。在上面的示例中，选择器的主题为li。
选择器 一词已被概括，因此为了简洁起见，现在可以指代 以下任何 一项，并且在任何给定时刻所指的是上下文。
- 简单选择器
- 复合选择器
- 复合选择器
- 选择器列表（例如，样式规则的“选择器”组件）

一些个人注意事项：

浏览器供应商创造了“键选择器”一词，用于选择器的实现，并非官方术语。但是，它经常用来表示“选择器的主题”，因为实现过程碰巧将选择器的主题用作确定匹配目的的键。
术语“伪选择器”是由作者创造的，用于混合伪类和伪元素，它不是正式的或确实有意义的术语。尽管您可以在早期的W3C CSS2 / 3草案中找到它，但这可能是一个错误。请不要使用此术语，因为它会通过将两个完全不同的概念归为一个总括术语而不必要地造成混乱。
伪元素（::pseudo-element）不是简单的选择器，因此不能出现在仅可以匹配实际元素的地方。但是，出于CSS解析的目的，它们仍被视为选择器，并且如上所述，当前它们可以出现在列表中任何复杂选择器的末尾（即，每个复杂选择器的最后一个或仅是复合选择器的末尾）。
在CSS中，典型的样式规则（以前称为“规则集”）由 选择器 和 声明块组成 。
命名空间前缀本身并不是选择器，但是它们可以应用于类型选择器，通用选择器和属性选择器，以匹配（或没有）命名空间的文档中的组件。
选择器的特异性目前仅指单个复杂选择器的特异性。匹配规则时，将考虑列表中与给定元素匹配的任何复杂选择器，以进行特异性计算。如果有一个以上的复杂选择器与一个元素匹配，则最具体的一个将用于计算。

对于某些4级选择器（例如:is()和增强的:not()，以及of S增强的:nth- child()伪标记中的表示法），特异性将是一个更为复杂的问题。

2020-05-16