欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序中使用自定義圖標(biāo)(阿里icon)的方法

 更新時間:2018年08月20日 15:19:09   作者:知世故而不世故  
這篇文章主要介紹了微信小程序中使用自定義圖標(biāo)(阿里icon)的方法,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下

weui提供的圖標(biāo)比較少,有時我們需要更多的圖標(biāo),可以使用以下方法自定義圖標(biāo)庫:

1,到阿里巴巴矢量圖標(biāo)庫(http://iconfont.cn/)生成自己的字體圖標(biāo),下載代碼,解壓,打開iconfont.css

2,在wxss文件中引用字體

<style type="less">
@font-face {
  font-family: 'iconfont';
  src: url(data:font/truetype;charset=utf-8;base64,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) format('truetype'),
}
.iconfont {
font-family:"iconfont" !important;
font-size:16px;
font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-fanhui:before { content: "\f0343"; }
.icon-gengduo:before { content: "\f0344"; }
</style>

3,使用字體

<view class="iconfont icon-fanhui">
      返回
</view>
<view class="iconfont icon-gengduo">
      更多
</view>

4,效果圖

總結(jié)

以上所述是小編給大家介紹的微信小程序中使用自定義圖標(biāo)(阿里icon)的方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

相關(guān)文章

最新評論