类中的后代选择器 [英] Descendant selectors in a class

问题描述

我可以从选择器中很好地理解 后代选择器是它们的工作方式，原因以及目的.

I can very well understand from this Selectutorial what element/tag based descendant selectors are, how and why they work and for what purpose.

但是随后我遇到了某些网站，这些网站为锚点<a>定义了一个类名，该类名由多个用空格分隔的名称组成，例如

But then I came across certain websites which define a class name for an anchor <a> which is made of several names separated by spaces, e.g.

<a class="samename nav_item samename" href="/messages/?refid=7"> Text </a>

然后我发现它们也称为"后代选择器"-或称为后代组合器?

I then found out that these are also called "descendant selectors" -- or are they called descendant combinators?

这是我停止理解的地方:

This is where I stopped understanding:

1. 是后裔"的第二种类型 选择器"是否与第一种类型相同?
2. 是后裔"的第二种类型 选择器"具有其他名称， 可以帮助我区分它 从第一种类型开始 它吗?
3. 第二种类型的目的是什么 后代选择器"?
4. 为什么要这样重复samename 后代选择器?

1. Is the 2nd type of "descendant selectors" the same as the 1st type?
2. Does the 2nd type of "descendant selectors" have a different name, that can help me differentiate it from the 1st type when referring to it?
3. What is the purpose of this 2nd type of "descendant selectors"?
4. Why repeat samename in such descendant selector?

任何能使我了解更多有关第二种类型的地方的技巧或指针，将不胜感激.

Any tips or pointers to places where I can learn more about this 2nd type would be much appreciated.

编辑:以下答复有助于使事情井井有条，特别是在使用适当术语方面.我将尝试总结到目前为止的理解-首先尝试以各种方式回答上述问题，然后列出一些见解，以期能对像我这样的未来css-laymen有所帮助:

The replies below helped put order into things, especially in regard to proper terminology. I will try to summarize my understanding so far -- first by attempting to answer the questions above in a respective manner, then listing some insights, with the hope that it can help future css-laymen like me:

1. 第二种类型不是后裔 选择器"，所以它不能 可能与第一个相同 类型.
2. 第二种类型的名称，目前， 是multiple class names assigned to the same tag.
3. 为每个元素分配多个类的一种用法是，然后可以链接类选择器，从而仅匹配列出所有类的元素，而不匹配具有一个或更少类的元素.
4. 这很可能是编程错误/错误/错误(尽管我在非常著名的网站上发现了它).

1. The 2nd type is not "descendant selectors" at all, so it cannot possibly be the same as the 1st type.
2. The name for the 2nd type, for now, is multiple class names assigned to the same tag.
3. One use of attributing multiple classes per element is that one can then chain class selectors, such that only elements with all the classes listed are matched, not those that have one or fewer of the classes.
4. This is most likely a programming mistake/error/bug (although I found it on a very prominent website).

见解(如果发现错误，请更正):

Insights (please correct if you spot a mistake):

1. 尽管写了什么 w3schools ，类(名称)为 不是选择器！选择器只能是HTML元素.
2. 但是，CSS 规则可能会引用 到一个HTML元素(或一组 HTML元素)，按类名使用 .classname表示法.这 符号被某些人称为 "类选择器"和这个 是我困惑的源头.它仅表示可以用于选择具有属性类的任何HTML元素.
3. CSS规则也可以引用HTML 元素(或一组HTML 元素)按元素ID，使用 #elementid表示法.这是一 完全不同的主题，但由于 一些人提到了这个符号 作为" ID选择器"， 可能这可能是 以及混乱，所以这是简短的 在这里提到.
4. 在HTML中，类"是一个属性.在 CSS，它是一个"选择器聚合器"， 用于选择任何HTML元素 具有该类属性.
到目前为止，最好的CSS 教程是 选择器.

1. Despite what's written in w3schools, a class (name) is not a selector! A selector can only be an HTML element.
2. However, a CSS rule may refer to an HTML element (or a group of HTML elements) by class name, using the .classname notation. This notation is referred to by some as "the class selector" and this is where my confusion stemmed from. It merely means it can be used to select any HTML element that has a class attribute.
3. A CSS rule may also refer to an HTML element (or a group of HTML elements) by element id, using the #elementid notation. This is an entirely different subject but since this notation is referred to by some as "the id selector" it's quite possible this could be a source for confusion as well, so it's briefly mentioned here.
4. In HTML, "class" is an attribute. In CSS, it is a "selector aggregator", used to select any HTML element that has that class attribute.
5. The best CSS tutorial, by far, is Selectutorial.

推荐答案

只有一个CSS后代选择器，即空格字符:

There is only one CSS descendant selector, and that is the space character:

E F /* Selects any F that descends from (or is contained by) an E */

以空格分隔的类名只是在单个HTML class属性中用空格分隔的多个类. class属性不是选择器，实际上甚至不是CSS的一部分.

Space-separated class names are just multiple classes that are separated by spaces, in a single HTML class attribute. The class attribute is not a selector, in fact not even part of CSS for that matter.

但是，在某种程度上相关的注释中，每个元素列出多个类的一种用法是，您可以随后链接类选择器，从而仅匹配具有 all 个列出的类的元素，而不匹配那些有一个或更少的课程.例如:

On a somewhat related note, however, one use of listing multiple classes per element is that you can then chain class selectors, such that only elements with all the classes listed are matched, not those that have one or fewer of the classes. For example:

.samename.nav_item /* Selects only elements that have both classes */

关于为什么在给定的HTML中重复samename的原因，我不知道.就像只有一个samename类一样.

As to why samename is repeated in your given HTML, I have no idea. It's the same as having just one samename class.

这篇关于类中的后代选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！