Выбор ответа Junior Селекторы и специфичность обновлено
Наследование против универсального селектора
Вопрос
Какого цвета будет текст внутри <span> и почему?
<style>
* { color: black; }
#box { color: red; }
</style>
<div id="box"><span>Текст</span></div>
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: Чёрного: бьёт прямо в span, а наследование слабее. Правило box применяется к div, а не к span.
Варианты ответа
- Красного: id
#boxспецифичнее, чем универсальный* - Красного: цвет наследуется от
#boxи перебивает* - Чёрного:
*бьёт прямо вspan, а наследование слабееправильный ответ - Чёрного: правило
*объявлено первым и потому важнее
Разбор
Правило #box применяется к div, а не к span. Для span есть только одно прямое правило, *, и унаследованное значение проигрывает ему всегда, независимо от специфичности родительского правила. Поэтому первые два варианта неверны: специфичности div и span не сравниваются. Четвёртый вариант прав в ответе, но не в причине: порядок в коде тут не участвует.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.