SVG的使用分2種，一種是靜態(tài)SVG矢量圖，就是本文的主角，本章節(jié)主要談?wù)摰臇|西，另一種是SVG矢量動(dòng)畫，是SVG的高級(jí)應(yīng)用，是給靜態(tài)SVG加上objectAnimator動(dòng)畫，應(yīng)用的很廣泛，是實(shí)現(xiàn)androidicon動(dòng)態(tài)交互的核心做法 上面的SVG圖大家都看到了，我。

最后，一個(gè)SVG文件的內(nèi)容是可以被復(fù)制，它也可以像其他WEB里的元素一樣被美化，SVG里有一部分可以被獨(dú)立出來，并且可以更改圖片的顏色，重置描邊大小，設(shè)置透明度，我們還可以給它用上某種效果例如模糊，甚至動(dòng)畫效果這一切通過CSS和JS就可以。

通過在 @keyframes 中逐幀更改 offsetdistance ，可以實(shí)現(xiàn)動(dòng)畫效果我們修改path的 d 屬性為 M10 80 C 40 10， 65 10， 95 80 S 150 150， 180 80 ， 相應(yīng)的也修改小方塊的 offsetpath 屬性就可以實(shí)現(xiàn)小方塊。

逐幀動(dòng)畫即是利用一張等間距的動(dòng)畫分解逐幀圖片，一般是由 js腳本模擬編寫 逐幀動(dòng)畫和GIF動(dòng)畫的差別在于， 腳本可以控制逐幀動(dòng)畫的快慢和動(dòng)作的暫停，而GIF動(dòng)畫無法在后期通過代碼進(jìn)行動(dòng)畫速率及透明度的修改 做一個(gè)逐幀。

通過標(biāo)簽 這可能是最簡(jiǎn)單的使用SVG的方法，而且是開發(fā)者最熟悉的方法SVG文件能夠像位圖一樣通過標(biāo)簽在網(wǎng)頁上使用缺點(diǎn)是SVG圖像可能包含動(dòng)畫，但鏈接里面的文件和任何腳本和交互的SVG代碼部分將被忽略通過CSS 可以通過CS。