Оформление SVG-фигур / Спасательный круг, часть 4 [18/20]
×

Спасательный круг, часть 4 [18/20]

Теперь все три «слоя» нашего рисунка готовы, и дело остаётся за малым.

Разрядим белую обводку последнего круга с помощью свойства stroke-dasharray, которое мы разбирали в одном из прошлых заданий.

Хотите верстать адаптивно, использовать БЭМ и LESS? Тогда записывайтесь на наш продвинутый интенсив.

Выполнить задание
HTML
<svg width="200" height="200"> <circle r="70" cx="100" cy="100" fill="none" stroke="lightgrey" stroke-width="55"/> <circle r="70" cx="100" cy="100" fill="none" stroke="tomato" stroke-width="50"/> <circle r="70" cx="100" cy="100" fill="none" stroke="white" stroke-width="50"/> </svg>
CSS
svg { border: 1px solid #dddddd; }
HTML Academy
  1. Окружности с белой обводкой задайте атрибут stroke-dasharray="20",
  2. а затем смените значение на 20 90.
Теория Проверить Следующее задание
Идёт запись на курс Продвинутый HTML и CSS #11, который стартует 22 мая.

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

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

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

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