ie上svg的兼容問題

svg可以說是目前最火的圖像文件格式了,是一種開放標準的矢量圖形語言,我們可以隨意改變其大小,顏色,在放大或改變尺寸的情況下其圖形質量不會有所損失,相比於icon較有優勢,但是,ie上會不顯示svg圖片就很尷尬了。我在項目中就遇到了這種問題,簡單提供兩種修改的思路,希望能夠幫到大家,也是爲了記錄ie中遇到的問題。

   首先這是一個簡單的svg的組成 <svg class="SvgIcon big-faceicon"><use xlink:href="static/media/sprite.svg#FaceID-1       47420a7-usage"></use></svg>,我們在網頁便可以看到。

  • 第一種方式   <svg class="SvgIcon big-faceicon"><image  xlink:href="static/media/sprite.svg#FaceID-1       47420a7-usage" /></svg>  就是將use標籤換爲image標籤,當然這個時候我們改變的svg顏色都會失效,那麼我們就會需要用到第二種方式
  • 第二種方式就是比較簡單粗暴的方式了,那就是在根源上改變svg的顏色,在我們的編碼器上打開svg文件,修改我們所需要的顏色就可以了。

這是身爲一個菜鳥對於ie兼容svg的一點拙見。不對的地方望指出~

      修改svg的方法

      在記事本或者編碼器打開svg文件!!修改之前建議大家打開先保存一份