SVG表示可縮放矢量圖形。
SVG定義XML格式基於矢量的圖形。
每章的例子
我們的“試一試”的主編,您可以編輯SVG,並點擊一個按鈕來查看結果。
SVG示例
<html>
<body>
<h1>My first SVG</h1>
<svg width="100" height="100">
<circle cx="50" cy="50" r="40"
stroke="green" stroke-width="4" fill="yellow"
/>
</svg>
</body>
</html>
試一試» 你應該已經知道了
在繼續之前,您應該具備以下的一些基本認識:
- HTML
- 基本的XML
如果你想先學習這些內容,請看我們的教程主頁 。
什麼是SVG?
- SVG表示可縮放矢量圖形
- SVG是用來定義基於矢量的圖形為Web
- SVG定義XML格式的圖形
- SVG圖形不丟失任何的質量,如果他們縮放或調整
- 每一個元素和SVG文件每個屬性都可以是動畫
- SVG是W3C推薦
- SVG與其他W3C標準如DOM和XSL集成
SVG是W3C推薦
SVG 1.0成為了2001年9月4日W3C建議。
SVG 1.1 2003年1月成為了14 W3C建議。
SVG 1.1 (Second Edition)成為2011年8月16日W3C建議。
SVG優勢
使用的SVG比其他圖像格式(如JPEG和GIF)的優點是:
- 可以創建SVG圖像,並用任何文本編輯器編輯
- SVG圖像可以被搜索,索引,腳本,並壓縮
- SVG圖像是可伸縮
- SVG圖像可以與高品質在任何分辨率進行打印
- SVG圖像縮放(and the image can be zoomed without degradation)
- SVG是一種開放標準
- SVG文件是純粹的XML
主要競爭對手為SVG是Flash。
最大的優勢SVG擁有Flash是與其他標準符合性(eg XSL and the DOM) 閃存依賴於專有技術,是不是開源。
創建SVG圖像
SVG圖像可以用任何文本編輯器創建,但它往往是更方便的繪圖程序中創建SVG圖像,比如Inkscape的 。