Потомки селекторов в классе - PullRequest
4 голосов
/ 26 мая 2011

Я очень хорошо понимаю из этого Учебное пособие , что основано на элементах / тегах Селекторные потомки , как и почему они работают и для каких целей.

Но тогдаЯ сталкивался с некоторыми веб-сайтами, которые определяют имя класса для якоря <a>, который состоит из нескольких имен, разделенных пробелами, например,

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

. Затем я обнаружил, что они также называются " потомок"селекторы"- или их называют комбинаторы-потомки ?

Здесь я перестал понимать:

  1. Является ли 2-й тип" селекторами-потомками ""такой же, как 1-й тип?
  2. Имеет ли 2-й тип" селекторов потомков " другое имя , что может помочь мне отличить его от 1-го типа при обращении к нему?
  3. Какова цель этого второго типа «селекторов потомков»?
  4. Зачем повторять samename в таких селекторах потомков?

Любые подсказки или указатели на местагде я могу узнать больше оэтот второй тип был бы очень признателен.

РЕДАКТИРОВАТЬ: Ответы ниже помогли навести порядок, особенно в отношении правильной терминологии.Я попытаюсь обобщить свое понимание до сих пор - сначала попытаясь ответить на поставленные выше вопросы соответствующим образом, затем перечислю некоторые идеи, надеясь, что это поможет будущим мирянам css, таким как я:

  1. 2-й тип вовсе не является «селектором потомков», поэтому он не может совпадать с 1-м типом.
  2. На данный момент имя 2-го типа - multiple class names assigned to the same tag.
  3. Одно из применений приписывания нескольких классов каждому элементу состоит в том, что затем можно объединить селекторы классов таким образом, чтобы сопоставлялись только элементы со всеми перечисленными классами, а не те, которые имеют один или меньше классов.
  4. ЭтоСкорее всего, это ошибка программирования / ошибка / ошибка (хотя я нашел ее на очень известном веб-сайте).

Выводы (исправьте, если обнаружите ошибку):

  1. Несмотря на то, что написано в w3schools , класс (имя) не селектор!Селектором может быть только элемент HTML.
  2. Однако правило CSS может ссылаться на элемент HTML (или группу элементов HTML) по имени класса, используя обозначение .classname,Эта нотация упоминается некоторыми как « селектор класса », и именно отсюда и возникла моя путаница.Это просто означает, что его можно использовать для выбора любого элемента HTML, который имеет атрибут класса .
  3. . Правило CSS также может ссылаться на элемент HTML (или группу элементов HTML) по элементам.id, используя запись #elementid.Это совершенно другая тема, но поскольку некоторые обозначения называются " селектором идентификаторов ", вполне возможно, что это также может привести к путанице, поэтому здесь она кратко упоминается.
  4. В HTML «класс» является атрибутом.В CSS это « агрегатор селектора », используемый для выбора любого HTML-элемента, имеющего этот атрибут класса.
  5. Наилучший учебник по CSS , безусловно, Учебное пособие .

Ответы [ 2 ]

5 голосов
/ 26 мая 2011

Существует только один селектор потомков CSS, и это пробел:

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

Имена классов, разделенных пробелами, представляют собой несколько классов, разделенных пробелами, в одном атрибуте HTML class. Атрибут class не является селектором, фактически даже не является частью CSS.

Однако, в некоторой степени связанной ноте, одно использование перечисления нескольких классов для каждого элемента состоит в том, что вы можете затем соединять селекторы классов таким образом, чтобы сопоставлялись только элементы с всеми перечисленными классами, а не те, которые имеют один или меньше классов. Например:

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

Относительно того, почему samename повторяется в вашем данном HTML, я понятия не имею. Это то же самое, что иметь только один samename класс.

4 голосов
/ 26 мая 2011

В вашем примере тег на самом деле имеет несколько разных классов (из которых один почему-то указан дважды).

В CSS-коде мы использовали бы пробел для разделения дочерних селекторов, но в HTML он просто позволяет нам поместить несколько классов в один набор скобок.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...