鍍金池/ 問答/HTML/ 阿里巴巴的矢量圖標(biāo)iconfont 在iphone6和6plus微信內(nèi)置瀏覽器中

阿里巴巴的矢量圖標(biāo)iconfont 在iphone6和6plus微信內(nèi)置瀏覽器中無法顯示,

在微信開發(fā)者工具和安卓手機的微信內(nèi)置瀏覽器中可以正常顯示
使用class 名的方法控制圖標(biāo)顯示哪個
結(jié)果如下:
圖片描述

生成的iconfont.eot,iconfont.svg,iconfont.ttf,iconfont.woff文件也放到對應(yīng)位置了;
stylus代碼如下:

@font-face 
    font-family: "iconfont";
    src: url('../font/iconfont.eot?t=1517900290179'); /* IE9*/
    src: url('../font/iconfont.eot?t=1517900290179#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'),
    url('../font/iconfont.ttf?t=1517900290179') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
    url('../font/iconfont.svg?t=1517900290179#iconfont') format('svg'); /* iOS 4.1- */

.iconfont 
    line-height: 1
    font-family:"iconfont" !important
    font-style:normal
    -webkit-font-smoothing: antialiased
    -moz-osx-font-smoothing: grayscale
    vertical-align: middle

.icon-shouye:before 
    content: "\e610"

.icon-xiala:before 
    content: "\e65c"
回答
編輯回答
挽青絲

@font-face {

font-family: 'fontello';
src: url(../font/fontello-trade.ttf) format('truetype');
//src: url('../font/fontello.eot#iefix') format('embedded-opentype'),
//   url('../font/fontello.woff') format('woff'),
//   url('../font/fontello.ttf') format('truetype'),
//   url('../font/fontello.svg#fontello') format('svg');
font-weight: normal;
font-style: normal;

}

font-family: "fontello";
/*font-size: 2rem;*/
font-style: normal;
font-weight: normal;
speak: none;
text-decoration: inherit;
width: 1em;
text-align: center;
font-variant: normal;
text-transform: none;
line-height: 1em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/*color: $mainColor;*/

}
圖片描述
這是我們公司的寫法

2017年3月24日 18:01
編輯回答
陌顏

你試試這個

2018年9月15日 17:59