Наследование и каскадирование / Ещё задачка на порядок кода [16/18]
×

Ещё задачка на порядок кода [16/18]

Здесь все просто.

Если два CSS-правила применяются к одному и тому же элементу и имеют одинаковую специфичность, то более приоритетным будет то правило, которое появится в коде позже другого.

С этим фактом вы уже познакомились на битве за курочку. А сейчас просто закрепим этот материал, выполнив несколько простейших головоломок на изменение порядка кода.

Хотите получать макеты для тренировки? Подписывайтесь на полезную рассылку!

Выполнить задание
HTML
<!DOCTYPE html> <html> <head> <title>Ещё задачка на порядок кода</title> <link href="https://fonts.googleapis.com/css?family=PT+Sans:400&subset=cyrillic" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="/assets/course66/catinbox.css"> </head> <body> <div class="boxes"> <div class="box cat-keksik">Кексик</div> <div class="box cat-rudolf">Рудольф</div> <div class="box cat-snezhok">Снежок</div> </div> </body> </html>
CSS
.cat-keksik { background-color: #e74c3c; /* Красный */ } .cat-rudolf { background-color: #3498db; /* Синий */ } .cat-snezhok { background-color: #2ecc71; /* Зеленый */ } .box{ background-color: #bdc3c7; /* Серый */ }
HTML Academy

Изменением порядка объявления стилей добейтесь, чтобы

  1. Кексик и Снежок сидели в серых коробках, а Рудольф в синей.
  2. Кексик сидел в красной коробке, Рудольф — в синей, а Снежок — в серой.
  3. Кексик сидел в красной коробке, Рудольф — в синей, а Снежок — в зеленой.
Теория Проверить Следующее задание
Идёт запись на курс Базовый HTML и CSS #16, который стартует 16 января.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.