SVG в HTML
SVG-файлы могут быть встроены в HTML-документов с помощью следующих тегов: <код вставки>, <объект> или <IFRAME>.
SVG-код может быть встроен непосредственно в страницу HTML, или вы можете связать непосредственно в файл SVG.
Использование тега <встраивать>
<Вставить>:
- Преимущества: Все основные браузеры поддерживаются, и разрешает создание сценариев
- Минусы: Не рекомендуется для использования в HTML4 и XHTML (но разрешенные в HTML5)
Синтаксис:
<embed src="circle1.svg" type="image/svg+xml" />
Результаты:
Использование тега <объект>
<Объект>:
- Преимущества: Все основные браузеры поддерживаются, и поддержка HTML4, XHTML и стандарт HTML5
- Недостатки: не позволяет использование сценариев.
Синтаксис:
<object data="circle1.svg"
type="image/svg+xml"></object>
Результаты:
Используйте тег <IFRAME>
<IFRAME>:
- Преимущества: Все основные браузеры поддерживаются, и разрешает создание сценариев
- Минусы: Не рекомендуется для использования в HTML4 и XHTML (но разрешенные в HTML5)
Синтаксис:
<iframe src="circle1.svg"></iframe>
Результаты:
SVG встроен непосредственно в HTML-коде
Firefox, Internet Explorer9, Google Chrome и Safari, вы можете вставлять код SVG прямо в HTML.
Примечание: SVG может быть встроен непосредственно в Opera.
примеров
<html>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<circle cx="100" cy="50" r="40" stroke="black"
stroke-width="2" fill="red"/>
</svg>
</body>
</html>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<circle cx="100" cy="50" r="40" stroke="black"
stroke-width="2" fill="red"/>
</svg>
</body>
</html>
Попробуйте »
Ссылка на SVG-файлов
Вы также можете связаться с этикеткой с <a> SVG файлов: Ссылка на SVG-файлов
Вы также можете связаться с этикеткой с <a> SVG файлов:
<a href="circle1.svg">View SVG file</a>
Результаты:
Просмотр файлов SVG