SVG 文件結構

SVG 屬於 XML 的延伸，所以只要略懂 html 的人就可以輕易上手。

文件基本結構

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <!-- 如果沒有特別用途，此段可省略。https://www.w3.org/QA/2002/04/valid-dtd-list.html  -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:lang="zh-tw">

<!-- svg 主體內容-->

</svg>

簡單地以文字格式存成副檔名為 .svg 的獨立檔案，由瀏覽器開啟即可呈現。

直接混入 html 文件

html 文件中將 <svg> 視為 inline-level 的元素

<figure class="svgBlock">
 <svg version="1.1">

 <!-- svg 內容-->

 </svg>
</figure>

主要元素

svg

g

defs

symbol

image

use

title

desc

更新日期：