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

Аватар пользователя Даниил Першин
Даниил Першин
14 марта 2023

Для вставки 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%;
}
0 0
Познакомьтесь с основами HTML и CSS бесплатно

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

6
ответов
3
ответа
1
ответ
2
ответа