iconfont svg 怎么引入

2025-02-24 09:51:59
推荐回答(2个)
回答1:

iconfont svg是没有办法直接引入的。

PS:可以通过的方式,从缓存里曲线引用svg>defs>symbol中的SVG图标。

引用举例:


   
       
           
               
           
       
   

   

iconfont的优缺点:

  • 大小可以自由地变化。

  • 颜色可以自由地修改。

  • 添加阴影效果。

  • *IE6也可以支持。

  • 支持一些CSS3对文字的效果。

  • 字体文件比图片文件小很多。

  • 由于是字体,所以只可以显示纯色图片,不支持多种颜色的图片(缺点)。

回答2:

使用font-face声明字体。font-family是自定的字体名称,url是字体文件的存放路径,format是字体文件格式。
@font-face {
font-family: 'iconfont'; /*自定的字体名称*/
src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('iconfont.woff') format('woff'), /* chrome、firefox */
url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
}