[SVG] 10. svg 格式如何放入網頁之中

你可以是使用類似 sketch 軟體來匯出 svg 檔案，或是直接撰寫 svg 格式的原始碼，那麼該如何放入網頁之中呢？我們就來看看有哪些方式吧。

使用 HTML 中的 img 標籤來載入

假設你有一個檔案是「your_svg_icon.svg」，可以直接使用 img 標籤，直接載入，如下語法：

使用 CSS 的 background-image 來載入

假設你有一個檔案是「your_svg_icon.svg」，那麼可以利用 CSS ，放入 CSS的各式語法當中，這裡舉的例子是放入 background-image 之中，如下語法：

在 HTML 當中，直接使用 inline 方式

你也有可能是直接撰寫 svg 原始碼的方式，那麼也可以直接寫在 HTML 當中，如下方式：

透過 object、iframe、embed 標籤來載入

雖說如此，但這個方式在實務上較少用，請參考就好，如下語法：