如何在HTML5中使用SVG

在HTML5中我們可以透過使用標籤、

SVG是一種向量圖形格式，可以隨著Web頁面的大小變化重新繪製以適應其尺寸，不會出現任何失真的情況；十分適合在響應式Web設計中使用。這篇文章就給大家具體介紹在HTML5中如何使用SVG，希望對你們有幫助。 【相關影片教學推薦：HTML5教學】

使用HTML5

SVG是HTML 5草案規範的一部分，即

註：

1、要使用

2、這只能用於靜態SVG的導入。

下面是一個簡單的HTML5 SVG範例。

<svg  id = "circle"  height = "200"  xmlns = "http://www.w3.org/2000/svg" > 
      <circle  id = "greencircle"  cx = "30"  cy = "30"  r = " 30"  fill = "red"  /> 
</svg>

效果圖：

#使用標籤匯入SVG映像

##註：使用標籤只能用於靜態SVG影像的導入。

<img src="/static/imghw/default1.png"  data-src="image.svg"  class="lazy"   src = "green-circle.svg"  height = "80"  alt="漂亮的绿色圆圈" />

效果圖：

#使用