Выбор ответа Junior Архитектура CSS обновлено
Наследование кастомного свойства
Вопрос
Какого цвета будет фон кнопки внутри <section class="promo">?
:root { --accent: blue; }
.promo { --accent: crimson; }
.button { background: var(--accent); }
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: crimson: значение наследуется от предка, где его переопределили. Кастомные свойства по умолчанию наследуются.
Варианты ответа
- crimson: значение наследуется от предка, где его переопределилиправильный ответ
- blue:
var()всегда берёт значение из:root, а не от предков - Фона не будет: у самой
.buttonсвойство--accentне объявлено - blue: правило
:rootподключено раньше и потому сильнее.promo
Разбор
Кастомные свойства по умолчанию наследуются. Кнопка внутри .promo получает --accent: crimson от предка, и var() подставляет его. :root не особый источник, это просто верх дерева. Объявлять свойство на самой кнопке не нужно, работает наследование. Порядок правил здесь не важен: они задают значение на разных элементах.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.