SVG 作為背景影象
你可以在 HTML 文件中顯示 SVG 檔案,方法是將其指定為 CSS 中的背景影象。例如:
.element {
background-size: 100px 100px;
background: url(my_svg_file.svg);
height: 100px;
width: 100px;
}
如果 SVG 檔案中指定的尺寸大於 HTML 元素的尺寸,則可能需要指定 background-size
屬性,以縮放 SVG 以適合其元素。
與使用 SVG 作為 <img>
一樣 ,值得注意的是這種方法存在一些侷限性:
- 瀏覽器支援不包括 Internet Explorer 8 及更早版本,也不包括 Android 2.3 及更早版本。
- 你無法使用 SVG 檔案外部的 CSS 設定 SVG 檔案中包含的各個元素的樣式。所有 CSS 必須在影象檔案本身內。