Что такое CSS selector

CSS селектор — это шаблон для выбора HTML-элементов на странице, чтобы применить к ним стили. Селекторы могут быть простыми (по тегу, классу, id) или сложными (комбинаторы, псевдоклассы, атрибуты).

Основные типы:

• По тегу: div { color: red; }
• По классу: .header { font-size: 20px; }
• По id: #main { width: 100%; }
• Универсальный: * { margin: 0; }
• По атрибуту: [type="text"] { border: 1px solid; }
• Комбинаторы (потомки, дети, соседи): div > p, h1 + p

Пример с псевдоклассом:

button:hover {
  background-color: blue;
}