CSSСелекторы


Вступление

Селекторы CSS идентифицируют определенные HTML-элементы в качестве целей для стилей CSS. В этом разделе рассказывается о том, как селектор CSS нацелен на элементы HTML. Селекторы используют широкий диапазон из более чем 50 методов выбора, предлагаемых языком CSS, включая элементы, классы, идентификаторы, псевдоэлементы и псевдоклассы и шаблоны.

Синтаксис

  • # id
  • , имя_класса
  • : псевдо-имя класса
  • :: псевдо-elementname
  • [ attr ] / * имеет атрибут attr . * /
  • [ attr = " value "] / * имеет атрибут attr , а его значение точно « value ». * /
  • [ attr ~ = " значение "] / * имеет атрибут attr , а его значение при разбиении по пробелу содержит « значение ». * /
  • [ attr | = " value "] / * имеет атрибут attr , а его значение точно « value », или его значение начинается с « value - ». * /
  • [ attr ^ = " value "] / * имеет атрибут attr , а его значение начинается с " value ". * /
  • [ attr $ = " value "] / * имеет атрибут attr , а его значение заканчивается « значением ». * /
  • [ attr * = " значение "] / * имеет атрибут attr , а его значение содержит « значение ». * /
  • имя элемента
  • *

замечания

  • Иногда вы видите двойные двоеточия ( :: :) вместо одного ( : . Это способ отделить псевдоклассы от псевдоэлементов .
  • Старые браузеры, как Internet Explorer 8, поддерживают только один двоеточие ( : ) для определения псевдо-элементов.
  • В отличие от псевдоклассов, для каждого селектора может использоваться только один псевдоэлемент, если он присутствует, он должен появляться после последовательности простых селекторов, которые представляют объекты селектора (будущая версия спецификации W3C может допускать множественные псевдоэлементы на селектор ).

Селекторы Связанные примеры