Встречается на собеседованиях • сегодня

Можно ли из дочернего элемента изменить стиль родительского элемента

Да, можно, но не напрямую. В CSS нет селектора для выбора родителя по дочернему элементу. Однако есть несколько обходных путей:

  1. Использование JavaScript:
js
const child = document.querySelector('.child');
child.parentElement.style.color = 'red';
  1. CSS-переменные:
    Родитель определяет переменные, которые может менять дочерний элемент:
css
.parent {
  --text-color: black;
  color: var(--text-color);
}
.child:hover {
  --text-color: red; /* изменит родителя */
}
  1. :has() (новый, но пока не везде поддерживается):
css
.parent:has(.child:hover) {
  color: red;
}

Лучший подход зависит от конкретной задачи и поддержки браузеров. Чаще всего используют JavaScript или пересматривают структуру стилей.

Sophi
Софи собрала все вопросы. Тренируйся и получай
офферы быстрее!
Попробовать бесплатноArrow

Следующий вопрос

Это единственный вопрос по вашему фильтру

как отвечать на вопрос
пример собеседования
фреймворки на собеседовании
типичные вопросы junior
интервью вопросы и ответы