• Теория
  • Теория

Custom properties, закрепление 3

Ваша задача — создать CSS-переменные и подобрать для них значения.

Стили компонента специально помещены внутрь тега style в HTML-редакторе. HTML-редактор заблокирован. Это значит, что вы можете редактировать только стили, в которых объявляются CSS-переменные.

Значения переменных указаны в пикселях и кратны 10. Возможные имена переменных перечислены ниже:

container-width,
container-padding,
item-gap,
border-radius

Этот вариативное испытание, предназначенное для закрепления ваших навыков работы с CSS Custom Properties.

Решение

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

:root {
  --container-width: 300px;
  --container-padding: 20px;
  --item-gap: 30px;
  --border-radius: 10px;
}
Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Введение в CSS Custom Properties» тренажёра «CSS Custom Properties» можно после регистрации и оформления подписки.