Что такое селектор `:has()`?

Question

Accepted Answer

## Родительский селектор

`:has()` — **относительный** селектор: элемент матчится, если внутри (или рядом по аргументу) есть подходящий потомок/сосед.

```css
/* карточка с картинкой */
.card:has(img) { padding-top: 0; }

/* label, если input невалиден */
label:has(+ input:invalid) { color: crimson; }

/* форма с отмеченным чекбоксом */
form:has(:checked) { border-color: green; }
```

Долго ждали «parent selector»; теперь можно стилизовать родителя по состоянию детей без JS. Цена: потенциально дорогие селекторы на больших DOM — не злоупотреблять глубокими `:has(*)`.