SVG как изображение
Изображения SVG могут использоваться как формат изображения в ряде контекстов. Многие браузеры поддерживают изображения SVG:
- Элементы HTML
<img>или<svg> - CSS
background-image
Гекко-специфические контексты
Кроме того, Gecko 2.0 представил поддержку использования SVG (en-US) в следующих контекстах:
- CSS
list-style-image - CSS
content - Элементы SVG
<image> - Элементы SVG
<feImage>(en-US) - Функция Canvas
drawImage
Ограничения
В целях безопасности, Gecko накладывает некоторые ограничения на контент SVG, когда он используется в качестве изображения:
- JavaScript отключён.
- Внешние ресурсы (например, изображения, таблицы стилей) не могут быть загружены, хотя их можно использовать, если они встроены в данные: URI.
:visited-стили ссылок не отображаются.- Стилизация виджитов на платформе (основанная на теме ОС) отключена.
Обратите внимание, что вышеуказанные ограничения являются специфическими для контекстов изображения; они не применяются, когда содержимое SVG просматривается напрямую или когда оно внедрено в виде документа с помощью встраивания элементов <iframe> (en-US), <object> (en-US), или <embed>.
Спецификации
| Specification | Status | Comment |
|---|---|---|
| HTML5 Определение 'SVG within <img> element' в этой спецификации. |
Рекомендация | Defines the usage of SVG within <img> elements. |
| CSS Backgrounds and Borders Module Level 3 Определение 'SVG within 'background-image' CSS property' в этой спецификации. |
Кандидат в рекомендации | Defines the usage of SVG within the background-image property. |