收藏
回答

【BUG】Iconfont外部字体在IOS上无法显示

框架类型 操作系统 操作系统版本 手机型号 微信版本
小程序 iOS IOS 10.3.3, IOS 11 iPhone 6s, iPhone 7p 6.6.2


我想在小程序里使用图标字体,根据百度的教程引入了iconfont:

@font-face {
 font-family: 'iconfont';  /* project id 563821 */
 src: url('http://at.alicdn.com/t/font_563821_35qb84hyycvdkj4i.eot');
 src: url('http://at.alicdn.com/t/font_563821_35qb84hyycvdkj4i.eot?#iefix') format('embedded-opentype'),
 url('http://at.alicdn.com/t/font_563821_35qb84hyycvdkj4i.woff') format('woff'),
 url('http://at.alicdn.com/t/font_563821_35qb84hyycvdkj4i.ttf') format('truetype'),
 url('http://at.alicdn.com/t/font_563821_35qb84hyycvdkj4i.svg#iconfont') format('svg');
}
.iconfont {
 font-family:"iconfont" !important;
 font-size:16px;
 font-style:normal;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;

}

.icon-shouye:before { content: "\e602"; }


.icon-jia1:before { content: "\e600"; }


.icon-tianjia:before { content: "\e601"; }


......



引入了以后,在pc端测试完美,在安卓上也可以正常显示


然而交给团队其他人测试的时候,在iphone 6s和iphone 7p上都出现了无法正常显示字体图标的情况


请问有人遇到相同的问题吗?有没有什么合适的解决方案?为什么我看大家遇到的都是安卓无法显示。


图标如下:






最后一次编辑于  2018-02-06
回答关注问题邀请回答
收藏

7 个回答

  • 洋葱头
    洋葱头
    2018-02-06

    应该是跨域的原因被阻止了,需要字体后台返回


    Access-Control-Allow-Origin 响应头允许跨域

    2018-02-06
    有用
    回复
  • 关中刀客
    关中刀客
    2020-06-17

    如果你用了

    //at.alicdn.com/t/font_1759934_f3qi49if9iu.css
    

    这样的地址,那就请在两个斜杠前面加上

    http:
    
    2020-06-17
    有用
    回复
  • 木子月月鸟
    木子月月鸟
    2018-08-27

    你好,我是刚入坑的小白,现在也遇到这个问题了,你给的资源我没怎么看懂,你能不能给我详细说下,万分感谢!!

    2018-08-27
    有用
    回复
  • 2018-02-06

    感谢!百度到了方法

    2018-02-06
    有用
    回复 2
  • 2018-02-06

    请问是写在前端里还是后端里?是后端返回的时候设置header吗

    2018-02-06
    有用
    回复
  • 2018-02-06

    难道说?IOS不支持从外部链接引入字体吗?

    2018-02-06
    有用
    回复
  • 2018-02-06

    有人吗 求解答

    2018-02-06
    有用
    回复
登录 后发表内容