Все сервисы Хабра
Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Закрыть
Задать вопрос
AndWEB
@AndWEB
JavaScript
HTML
CSS
SVG
Как верстать такой прогресс бар?
И анимировать его, смотрел на Codepen.io, вроде понятно но как сделать градиентом саму полоску прогресс бара?
Вопрос задан
более трёх лет назад
593 просмотра
Комментировать
Подписаться
3
Средний
Комментировать
Facebook
Вконтакте
Twitter
Помогут разобраться в теме
Все курсы
Нетология
Fullstack-разработчик на Python + нейросети
20 месяцев
Далее
Skillfactory
Профессия Веб-разработчик
12 месяцев
Далее
Яндекс Практикум
Фронтенд-разработчик
10 месяцев
Далее
Решения вопроса
1
Владимир Проскурин
@Vlad_IT
Куратор тега CSS
Front-end разработчик
В defs определяете градиент
https://developer.mozilla.org/ru/docs/Web/SVG/%D0%...
и в stroke круга вместо цвета пишите
stroke: url(#название-градиента)
вот к вашему примеру
https://codepen.io/anon/pen/gBRRXX?editors=1010
Ответ написан
более трёх лет назад
1
комментарий
Нравится
2
1
комментарий
Facebook
Вконтакте
Twitter
AndWEB
@AndWEB
Автор вопроса
Большое спасибо!
Написано
более трёх лет назад
Пригласить эксперта
Ответы на вопрос
1
Олег
@politon
HTML5,CSS3,JS,PHP,SQL,API,canvas,animation...
Go ссылку на то, что реализовано
Ответ написан
более трёх лет назад
1
комментарий
Нравится
1
комментарий
Facebook
Вконтакте
Twitter
AndWEB
@AndWEB
Автор вопроса
Нашел вот такой проект на Codepen.io
https://codepen.io/be-key/pen/pJKJeG
Написано
более трёх лет назад
Ваш ответ на вопрос
Войдите, чтобы написать ответ
Войти через центр авторизации
Похожие вопросы
CSS
Простой
Можно ли использовать функцию calc() в медиазапросах?
1 подписчик
вчера
132 просмотра
1
ответ
HTML
+1 ещё
Простой
Как реализовать форму ввода как в веб-версии chatGPT?
1 подписчик
вчера
108 просмотров
0
ответов
JavaScript
+2 ещё
Простой
Как получить события VK.VideoPlayer используя JS?
1 подписчик
11 нояб.
97 просмотров
1
ответ
CSS
+1 ещё
Простой
Как оптимизировать svg картинку?
1 подписчик
11 нояб.
121 просмотр
1
ответ
JavaScript
+1 ещё
Сложный
Почему зависает виджет в OBS?
1 подписчик
10 нояб.
144 просмотра
0
ответов
JavaScript
Простой
Смещение группы в fabric.js?
1 подписчик
06 нояб.
127 просмотров
0
ответов
CSS
Средний
Как найти стили в шаблоне Битрикс?
1 подписчик
06 нояб.
155 просмотров
0
ответов
JavaScript
+2 ещё
Простой
Как сделать горизонтальный скролл стрелками?
1 подписчик
05 нояб.
198 просмотров
0
ответов
PHP
+2 ещё
Простой
Создание элемента с необычной формой и прозрачным фоном и рамкой?
1 подписчик
03 нояб.
173 просмотра
0
ответов
CSS
Простой
Как выстроить 4 блока, чтобы расстояния были одинаковые на флексах?
1 подписчик
31 окт.
139 просмотров
2
ответа
Показать ещё
Загружается…
Вакансии с Хабр Карьеры
Fullstack Разработчик (Next.js / JavaScript / TypeScript)
App Company
от 200 000 до 300 000 ₽
Web-разработчик/WordPress программист (Full-stack)
JustBusiness
•
Санкт-Петербург
от 130 000 до 150 000 ₽
React разработчик
ITK academy
•
Нижний Новгород
от 50 000 до 90 000 ₽
Минуточку внимания
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации
Закрыть
Реклама