Как вставить svg в html

4 года назад

Человек-Молекула

Ответы

Для вставки SVG в HTML страницу есть несколько способов:

Использование тега <img>:

<img src="path/to/image.svg" alt="SVG Image">

Использование тега <object>:

<object type="image/svg+xml" data="path/to/image.svg" width="100%" height="100%">
  <img src="fallback-image.png" alt="SVG Image">
</object>

Использование тега <embed>:

<embed src="path/to/image.svg" type="image/svg+xml" />

Использование тега <svg> внутри HTML страницы:

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <circle cx="50" cy="50" r="50" />
</svg>

Использование CSS свойства background-image:

div {
  background-image: url("path/to/image.svg");
  background-size: cover;
  width: 100%;
  height: 100%;
}

3 года назад

Даниил Першин

10 месяцев

Фронтенд-разработчик

Верстка на HTML5 и CSS3, Программирование на JavaScript в браузере, разработка клиентских приложений используя React

5 месяцев

Профессиональная верстка

Навык адаптивной вёрстки с современными подходами для корректного отображения сайтов на любых устройствах и разрешениях

1 месяц

Позиционирование в CSS

Навык разработки адаптивных интерфейсов, позволяющий создавать удобные и функциональные решения для различных устройств

2 месяца

Bootstrap

Навык работы с SASS, Bootstrap 5 и Gulp для ускорения, упрощения и оптимизации процесса вёрстки и разработки сайтов

1 месяц

Анимация CSS

Навык создания анимаций в CSS для улучшения пользовательского опыта и повышения востребованности на рынке

Похожие вопросы