阿里巴巴矢量图显示失效问题——解决笔记

  • Post author:
  • Post category:其他




阿里巴巴矢量图显示失效问题——解决笔记


遇到的问题:


近期将h5页面嵌入某APP中,页面中使用的阿里巴巴矢量图显示不正常,显示一个框框里面一个叉叉

在这里插入图片描述


解决问题:

  1. 检查引用的iconfont.css里面是否有使用的icon图标,结果发现是有图标的,检查是否在h5页面里面引用了iconfont.css,结果发现也是正确引用了,然后我就很好奇为什么在PC端是正常显示,然后直接用移动端的浏览器,或者是在微信等分享给好友通过链接进入都是有icon的,但是偏偏在嵌入某APP里后,图标不能正常显示。(真是很气人,🤢,咕咕~~~~)

  2. 最后才清醒过来。。。。

    在我们正常下载了阿里巴巴矢量图压缩包,解压之后里面的文件是这样子的,里面有iconfont.css,还有iconfont.svg等字体文件,具体如下:

    在这里插入图片描述

    一般我使用的时候直接在h5页面里引用iconfont.css,但是文件夹里的文件我只留一个iconfont.css文件,把iconfont.svg、iconfont.ttf删除掉,之前正常在用是没有显示问题的,但这个就是嵌入某APP不正常显示icon的问题所在啊啊啊啊啊啊啊啊~~~~~~



    集美们,,,,,,,,,,一定要正常使用iconfont,不要删除字体文件,不然就会出现框框里面有叉叉的情况了



版权声明:本文为weixin_51973859原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。