收藏
回答

【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  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

6 个回答

  • 林超
    林超
    2018-02-06

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


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

    2018-02-06
    赞同
    回复
  • 木子月月鸟
    木子月月鸟
    2018-08-27

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

    2018-08-27
    赞同
    回复
  • 進
    2018-02-06

    感谢!百度到了方法

    2018-02-06
    赞同
    回复 2
    • 李吉
      李吉
      2018-10-24

      怎么解决的呢?

      2018-10-24
      回复
    • G.Y
      G.Y
      04-19

      同问怎么解决的

      04-19
      回复
  • 進
    2018-02-06

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

    2018-02-06
    赞同
    回复
  • 進
    2018-02-06

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

    2018-02-06
    赞同
    回复
  • 進
    2018-02-06

    有人吗 求解答

    2018-02-06
    赞同
    回复