html и css для начинающих

кнопка удаления
кнопка удаления
кнопка меню

Виды селекторов CSS

Универсальный селектор


Образец:

Универсальный селектор

Описание: Иногда требуется установить одновременно один стиль для всех элементов веб-страницы, например, задать шрифт или начертание текста. В этом случае поможет универсальный селектор, который соответствует любому элементу веб-страницы. Если правило не предусматривает явного указания селектора, то автоматически выводится универсальный селектор.

Пример

Селектор по типу или селектор тегов


Образец:

selectorbytype

Описание:
Этот селектор обозначает, что стили будут применяться к данному элементу. В качестве селектора может выступать любой тег HTML, для которого определяются правила, такие как: цвет, фон, размер и др.

пример

Селектор порожденных элементов или контекстные селекторы


Образец:

childelementselector
пример

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

Селектор потомков или дочерний селектор


Образец:

descendantselector

Описание:
Более строгий селектор, обеспечивает совпадение только с дочерним элементом (элемент располагается внутри родительского).

Селектор смежных родственных элементов или соседние селекторы


Образец:

neighboring

Соседними называются элементы HTML, когда они следуют друг за другом, во внимание принимаются только сами элементы и их положение в дереве документа.

Селектор по классу


Образец:

class

Описание:
Cелектор по классу позволяет выбрать элементы с атрибутом класса, содержащим конкретные значения и обеспечивает совпадение со всеми элементами, содержащими значения данного класса.

Селектор по идентификатору


Образец:

idselector

Описание: Cелектор по идентификатору позволяет выбрать элементы, содержащие идентификатор (id). Наименование значения идентификатора должно быть указано сразу же после знака решетки. Если же имя элемента перед знаком решетки отсутствует, селектор по идентификатору обеспечивает совпадение со всеми элементами, содержащими значение этого идентификатора.

Простой селектор по атрибутам


Образец:

attr

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

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


Образец:

attr2

Описание:
Этот селектор позволяет выбрать любой элемент по точному и полному значению атрибута. В случае указан тег - стиль применяется ко всем тегам, которые содержат указанное значение атрибута. Если тег не указан — только к определенным селекторам.