为什么iconfont字体图标在安卓机上显示不出来

发布于 7 年前作者 chao9914491 次浏览最后编辑 7 年前来自 ask
  1. 模拟器和ios上都能正常显示,但安卓机上显示不了,准确地说显示为一个带框的X

  2. css代码如下:

@font-face {

    font-family: “iconfont”;

    src: url(‘https://xxx/iconfont.eot’); /* IE9*/

    src: url(‘https://xxx/iconfont.eot?#iefix’) format(‘embedded-opentype’),

    url(‘https://xxx/iconfont.woff’) format(‘woff’), /* chrome, firefox */

    url(‘https://xxx/iconfont.ttf’) format(‘truetype’), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/

    url(‘https://xxx/iconfont.svg#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;

}

8 回复
jingxiang
jingxiang1 楼6 年前

请问我的base64拷入微信开发工具中总报错,是因为太长了吗?怎么办啊?就想实现一个楷体的效果。

liyi
liyi2 楼6 年前

你好!!!请问为什么我这里遇到的情况是安卓能正常显示但IOS不能显示????

gang53
gang533 楼6 年前

请问 我的怎么报 something must be wrong 这个错!

junhe
junhe4 楼6 年前

https的ios能用,http的开发者工具和android能用。。。

sxue
sxue5 楼6 年前

我也是模拟器正常,真机 方框里一个X。

之前只引入了iconfont.css。将iconfont.tff也加入项目,就可以了。

jingyi
jingyi6 楼6 年前

我花了两天时间找到了原因,  直接引用线上的,要在安卓下能正常显示要设置__服务器允许跨域,__

或者将字体文件转出base64直接引入,希望能帮上忙,不要在入坑了

yan47
yan477 楼6 年前

楼上正解,万分感谢,但我有一个小小的疑问,就是我之前用的url使用本地文件路径的时候控制台会报错,人家说必须放线上,然后我就换成了线上的链接,果然可以,现在我用了base64之后,按理来说使用的是本地文件,但是却没有像之前那样报错,说明其实把ttf放在本地也是可以的,所以,为什么base64的本地文件就可以,而.ttf的本地文件就不行呢?

penggang
penggang8 楼5 年前

我是将ttf字体文件,通过这个网站https://transfonter.org/ 转化为base64位  然后把下载的文件中的.css文件中的第二个“@font-face”复制下来插入到app.wxss中  就可以正常使用啦!