Question

因此，在编写CSS时，我经常会看到人们或网站有类似

的内容

.img > border > div > #select {color:white}

由于我已经开始进行Web开发，所以我只使用了...单个CSS类。

我不确定这是完全正确的，但基本上它们都是连接的。

这项技术的名称是什么，你们有没有我能读到的有用资源？我曾经尝试过谷歌，但我根本就不知道如何在谷歌上说这个。

Answer 1

整个序列.img > border > div > #select通常简称为selector，因为它是CSS规则中选择要应用规则的元素的一部分。然而，有一整个specification致力于选择者; CSS只描述了选择器在CSS规则中的作用。

>是一个组合子，特别是child combinator。组合器用于表示两个元素之间的关系，在这种情况下是父子关系：.parent > .child。其余的.img，border，div和#select都是各种simple selectors。

典型的选择器由简单的选择器和组合器组成。您可以让选择器只包含一个简单的选择器.child，多个简单选择器div.child，组合器#parent > div.child或这些选择器的任意组合。

Answer 2

它是selector并表示它适用的HTML文档元素层次结构，即

一类图像的边框有一个ID为select的div，应用白色。

Answer 3

>符号本质上是一种指定元素属于父元素的方式。在您的情况下，id为“select”的元素的父元素是一个div，其边框的父元素具有类“img”。更多信息here。

Answer 4

这些被称为子选择器。

它涵盖在W3 specification中，整个指南本身就是一个很好的资源，只有简单的例子。

Answer 5

他们被称为CSS选择器。看这里： MDN

Answer 6

以下是您提供的选择器的简单简洁说明

.img > border > div > #select {color:white}

上面的CSS是选择器的层次结构，其中规则应用于div标签，边框标签和类中的#selector .img

例如

<img class="img"><border><div><div id='select'>some content</div></div></border></img>

这里应用了上述CSS规则。类似地，规则可以如下创建

element>element
selector>selector
element>selector
selector>element

希望这有帮助！