微信小程序使用iconfont

常用的引入方式在小程序中不行,例如:

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

.iconfont {
  font-family:"iconfont" !important;
  font-size:16px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

需要将iconfont官网上下载的iconfont.ttf文件转成base64,然后引入

1、打开https://transfonter.org/,点击“add fonts”导入iconfont.ttf,然后点击Convert

2、下载文件后找到stylesheet.css,复制第一行的@font-face到你自己的.wxss

猜你喜欢

转载自www.cnblogs.com/wenxiangxu/p/9021300.html