Задать вопрос
@gregorypetrov
javascript

Перекрасить svg изображение, вставленное через background-image: если можно, то как?

В веб-интерфейсе десятки иконок в формате svg.
Они вставлены так: кнопка - это div, его background-image - это svgшная иконка.

Есть ли способ программно (css, javascript или еще как-либо) поменять отображаемый цвет заливок и контуров всех этих иконок?

Если никак, то какие альтернативы?
Спасибо всем!
  • Вопрос задан
  • 862 просмотра
Комментировать
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ответы на вопрос 2
@fronter321
Background-image не является объектом страницы. Так что никак(на мой взгляд.). Только прописывать иконки внутри разметки.
Ну и вот здесь есть обсуждения на эту тему тыц
Ответ написан
Комментировать
Комментировать
@Stepanya 
<!-- `<use>` shape defined ON THIS PAGE somewhere else -->
<svg viewBox="0 0 100 100">
   <use xlink:href="#icon-1"></use>
</svg>

<!-- `<use>` shape defined in an EXTERNAL RESOURCE -->
<svg viewBox="0 0 100 100">
   <use xlink:href="defs.svg#icon-1"></use>
</svg>


https://css-tricks.com/svg-use-external-source/
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
summer • Ярославль
от 100 000 до 140 000 ₽
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
Мэтч
от 80 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Собрать сайт на Vue / Laravel
19 апр. 2024, в 11:14
65000 руб./за проект
Отрисовка дизайна главной и внутренней
19 апр. 2024, в 11:08
5000 руб./за проект
Работы по АСУТП
19 апр. 2024, в 10:59
150000 руб./за проект
Ещё заказы