@Tigronix

Можно ли вставить svg используя :after?

Можно ли вставить svg используя только :after?
f49fad9569594dffb2f1be6c716465f4.png
  • Вопрос задан
  • 13560 просмотров
Решения вопроса 1
Creamov
@Creamov
Senior Fullstack Software Engineer
Конечно. Используйте для этого свойство content.

.some-element::after {
    content: url('data:image/svg+xml; base64, <тут_закодированный_svg>');
    /* или */
    content: url("data:image/svg+xml; utf8, <тут_код_svg>");
}

P.S. в CSS3 для псевдо-элементов необходимо использовать два двоеточия ::before, ::after, вместо одного.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@svgishe
Разработчик, дизайнер, SEO.
Да можно, я опадал.
Но скажу одно, есть один минус, посмотрите в разных браузерах.
Отображаются они по разному (иногда, в старых браузерах особенно в опере) ie до 9 вообще не поддерживает, так что надо определять поддержку а после выставлять соответствующий класс.
Если не поддерживается, то ссылка на png/
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы