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

Необходимые условия: Базовые знания компьютера, наличие основного программного обеспечения, представление о работе с файлами, знание основ HTML  (изучите  введение в HTML) и общее понимание того, как работает CSS.
Цель: Подробно изучить селекторы CSS.

Основы

В предыдущей статье подробно рассказывалось синтаксисе и терминологии CSS в целом. Итак: селекторы являются частью CSS-правила и идут непосредственно перед блоками объявлений

Типы селекторов

Селекторы можно разделить на следующие категории:

  • Простые селекторы (Simple selectors): Указывают на один или несколько элементов на основании типа, класса (class), или id элемента.
  • Селекторы атрибутов (Attribute selectors): Указывают на один или несколько элементов на основании их атрибутов/значений атрибутов.
  • Псевдоклассы (Pseudo-classes): Указывают на один или несколько элементов, находящихся в определенном состоянии, например те на которые наведен курсор мыши, выделенные или неактивные элементы, или, скажем, элемент, являющийся первым потомком своего родителя в дереве DOM.
  • Псевдоэлементы (Pseudo-elements): Указывают одну или несколько частей содержимого страницы, определенным образом расположенные по отношению к элементу: например, первое слово в каждом параграфе или что-либо прямо перед элементом.
  • Комбинации (Combinators): Это не селекторы как таковые, а способы объединения селекторов для выбора по нескольким условиям одновременно. Например, можно выбрать только те параграфы, которые являются прямыми потомками элементов div или которые следуют сразу за заголовком.
  • Группы селекторов (Multiple selectors): Идея здесь в том, что в одном CSS-правиле можно разместить несколько селекторов, отделив их друг от друга запятыми - тогда соответсвующий набор объявлений применяется сразу ко всем элементам, на которые указывают эти селекторы.

Обзор статей по селекторам

В четырех следующих статьях исследуются различные аспекты селекторов  — поскольку информации по ним очень много, ее решено было давать по частям, чтобы не пугать вас объемом и позволить делать перерывы. Вот эти статьи:

Очень советуем начать с простых селекторов, на случай если вы пропустили какую-нибудь нужную информацию.

Метки документа и участники

 Внесли вклад в эту страницу: olesgeras, mariag
 Обновлялась последний раз: olesgeras,