vue中使用阿里矢量图步骤及在ie中不显示解决

在阿里矢量图库中下载就不详细介绍了

  1. 将下载好的压缩包解压
  2. 在assets中新建iconfont文件夹
  3. 将解压后的 iconfont.css,iconfont.ttf,iconfont.eot文件放入其中
  4. 修改iconfont.css中的路径

注意ie中只适合eot格式

@font-face {font-family: "iconfont";
  src: url('./iconfont.ttf'); /* IE9*/
  src: url('./iconfont.eot'); /* IE9*/
  src: url('./iconfont.ttf') format('embedded-opentype'), /* IE6-IE8 */
  url('./iconfont.ttf') format('woff'),
  url('./iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('./iconfont.ttf') format('svg'); /* iOS 4.1- */
  src: url('./iconfont.eot') format('embedded-opentype'), /* IE6-IE8 */
  url('./iconfont.eot') format('woff'),
  url('./iconfont.eot') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('./iconfont.eot') format('svg'); /* iOS 4.1- */
}

猜你喜欢

转载自blog.csdn.net/qq719756146/article/details/88111909