Селекторы - это достаточно мощный инструмент который позволяет нам выбирать элементы не только по тегу но и по различным атрибутам, будь то id, class или любой атрибут, а также выбирать элементы по наведению мышки, четные или нечетные и многое другое.
Рассмотрим самые распространенные селекторы:
1. Селектор по тегу - самый простой селектор который помогает нам выбрать элементы по названию их тега, для этого нам нужно только указать название тега без скобок.
2. Селектор по классу. Если мы хотим привязывать стили только к определенным элементам мы можем использовать селекторы по классу, для этого нам необходимо задать атрибут class с для тега html с логическим значением. Для того чтобы добраться к элементу по классу нам нужно перед значением атрибута class нужного нам элемента поставить '.' точку.
3. Селектор по атрибуту. Работает абсолютно аналогично селектору по классу, но имеет другой синтаксис [имя-атрибута="значение атрибута"]
Аналогично можно использовать селектор только по названию атрибута, без значения.
4. Селектор по идентификатору. Этот селектор похож на селектор выборки элементов по классу но ключевое отличие состоит в том что для использования такого селектора вам необходимо давать html тегам атрибут id, а значение этого атрибута в свою очередь должно быть уникально в рамках всей страницы. Из-за этих ограничений вы не можете создавать одинаковые атрибуты id на всех тегах, так как это будет ошибкой.
Пример выбора элемента по id:
P.S. - Больше уроков у меня на канале
P.P.S. - Файлы с урока