Как вставить код svg в html?
2 ответа
от
kendall_mckenzie ,
2 года назад
@caterina Вставить код svg в html можно через тег img :
1
|
<img src="1.svg" alt="mysvg"> |
или через тег object :
1
|
<object type="image/svg+xml" data="1.svg" width="80px"></object> |
от
rodger.botsford ,
год назад
@caterina
Для вставки кода SVG в HTML можно использовать тег <svg>. Например, чтобы вставить следующий код SVG:
1 2 3 |
<svg viewBox="0 0 100 100"> <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> </svg> |
нужно написать следующий код HTML:
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Example</title>
</head>
<body>
<svg viewBox="0 0 100 100">
<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</body>
</html>
|
В теге <svg> важно указать атрибут viewBox, который задает размеры и координаты изображения в SVG. Также можно добавлять различные атрибуты для настройки внешнего вида графики, например, атрибуты stroke для цвета линии и fill для цвета заливки.
15