SVG 圖像是使用各種元素創(chuàng)建的，這些元素分別應(yīng)用于矢量圖像的結(jié)構(gòu)、繪制與布局。如果svg不是根元素，svg 元素可以用于在當(dāng)前文檔（比如說，一個(gè)HTML文檔）內(nèi)嵌套一個(gè)獨(dú)立的svg片段 。 這個(gè)獨(dú)立片段擁有獨(dú)立的視口和坐標(biāo)系統(tǒng)。
所有SVG圖像的根元素都是 <svg>元素。svg元素使用規(guī)則:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> </svg>
請(qǐng)記住不要忘記使用兩個(gè)命名空間聲明，否則Firefox不會(huì)將SVG文件呈現(xiàn)為圖像，而是將其解釋為任何其他XML文件。
SVG元素可以相互嵌套，如下所示:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <svg > </svg > </svg>
嵌套SVG元素可用于將SVG形狀分組在一起，并將其放置為一個(gè)集合。嵌套在svg元素內(nèi)的所有形狀都將相對(duì)于其包圍svg元素的位置（x，y）定位（x，y）。通過移動(dòng)封閉svg元素的x和y坐標(biāo) ，您也可以移動(dòng)所有嵌套的形狀。
這是一個(gè)在兩個(gè)svg元素內(nèi)嵌套兩個(gè)矩形的示例。除顏色外，兩個(gè)矩形的x，y，高度和寬度定義相同。包圍的 svg元素具有不同的x值。由于矩形的x位置是相對(duì)于其封閉svg元素x位置解釋的，因此兩個(gè)矩形在不同的x位置顯示。
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <svg x="10"> <rect x="10" y="10" height="100" width="100" style="stroke:#ff0000; fill: #0000ff"/> </svg> <svg x="200"> <rect x="10" y="10" height="100" width="100" style="stroke:#009900; fill: #00cc00"/> </svg> </svg>測(cè)試看看 ?/?
注意名稱空間屬性僅在根svg元素上是必需的。svg如果未設(shè)置任何名稱空間，則假定所有嵌套元素都在默認(rèn)名稱空間（在根元素中設(shè)置）內(nèi)。
這是運(yùn)行上面代碼生成的SVG圖像: