HTML5 內聯 SVG · W3School HTML & CSS 教程

# HTML5 內聯 SVG **HTML5 支持內聯 SVG。** ## 什么是SVG？ * SVG 指可伸縮矢量圖形 (Scalable Vector Graphics) * SVG 用于定義用于網絡的基于矢量的圖形 * SVG 使用 XML 格式定義圖形 * SVG 圖像在放大或改變尺寸的情況下其圖形質量不會有損失 * SVG 是萬維網聯盟的標準 ## SVG 的優勢與其他圖像格式相比（比如 JPEG 和 GIF），使用 SVG 的優勢在于： * SVG 圖像可通過文本編輯器來創建和修改 * SVG 圖像可被搜索、索引、腳本化或壓縮 * SVG 是可伸縮的 * SVG 圖像可在任何的分辨率下被高質量地打印 * SVG 可在圖像質量不下降的情況下被放大 ## 瀏覽器支持 Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持內聯 SVG。 ## 把 SVG 直接嵌入 HTML 頁面在 HTML5 中，您能夠將 SVG 元素直接嵌入 HTML 頁面中： ### 實例 ``` <!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190"> <polygon points="100,10 40,180 190,60 10,60 160,180" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" /> </svg> </body> </html> ``` 結果：如需學習更多有關 SVG 的知識，請閱讀我們的 [SVG 教程](/svg/index.asp "SVG 教程")。