@tkachenkoaanna097

Как загрузить свг картинку на какой то сервис?

для вставки потом на codepen или jsfiddle.
многие сайты позволяют все форматы
кроме свг
  • Вопрос задан
  • 53 просмотра
Решения вопроса 2
sniggering_deus
@sniggering_deus Куратор тега CSS
Front-End Developer & Fullstack Designer
1. Купить хостинг, и забрасывать картинки туда.
2. Купить PRO - статус на Codepen, после чего можно получить небольшой хостинг от codepen для хранения активов.
3. Создать на Github репозиторий, залить папку с изображениями и можно грузить оттуда.
4. И наверное один из простых вариантов которые подходят для SVG:

Можно перевести SVG в data URI, например, с помощью такого генератора. На выходе будет готовый SVG код изображения который можно вставить в CSS файл.

В итоге такая SVG:

<svg width="1em" height="1em" viewBox="0 0 16 16" 
xmlns="http://www.w3.org/2000/svg">
  <path fill-rule="evenodd" 
d="M8 0a.5.5 0 0 1 .416.223l3 4.5A.5.5 0 0 1 11 5.5h-.098l2.022 3.235a.5.5 
0 0 1-.424.765h-.191l1.638 3.276a.5.5 0 0 1-.447.724h-11a.5.5 0 0 
1-.447-.724L3.69 9.5H3.5a.5.5 0 0 1-.424-.765L5.098 
5.5H5a.5.5 0 0 1-.416-.777l3-4.5A.5.5 0 0 1 8 0z"/>
  <path d="M7 13h2v3H7v-3z"/>
</svg>


Может стать такой:

background-image: 
url("data:image/svg+xml,%3Csvg 
width='1em' height='1em' viewBox='0 0 16 16' 
xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' 
d='M8 0a.5.5 0 0 1 .416.223l3 4.5A.5.5 0 0 1 11 5.5h-.098l2.022 
3.235a.5.5 0 0 1-.424.765h-.191l1.638 3.276a.5.5 0 0 
1-.447.724h-11a.5.5 0 0 1-.447-.724L3.69 9.5H3.5a.5.5 0 0 1-.424-.765L5.098 
5.5H5a.5.5 0 0 1-.416-.777l3-4.5A.5.5 0 0 1 8 0z'/%3E%3Cpath d='M7 
13h2v3H7v-3z'/%3E%3C/svg%3E");


Далее уже можно установить как бекграунд для какого-нибудь элемента. Но в таком виде, SVG не будет иметь анимаций и пр. Поэтому если оценить ситуацию трезво, тогда вариант с личным хостингом и/или Репо на Гитхабе - самые лучшие.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
05 авг. 2020, в 21:55
20000 руб./за проект
05 авг. 2020, в 20:58
10000 руб./за проект
05 авг. 2020, в 20:21
10000 руб./за проект