在用阿里iconfont的Unicode和Font class两种方法制作字体图标的过程中,刚开始做的时候,写完代码运行出来是如下图的方框。
后来摸索出了解决的办法,分享给大家看看是否也能一起解决。
第一种:Unicode
1.第一步要把下载好的font_*******文件夹放在和你项目的同一目录下面.
2.第二步去到阿里的iconfont 里面点击复制代码粘贴到你的项目去,第一次点开会显示(暂无代码,点击生成),点击生成即可出现代码。
3.第三步点击阿里iconfont 的 Font class ,复制font class的代码下来,用link 链接增加到项目里面去。
4.第四步:(这里容易出问题导致字体图标会显示成方框)
①把上面的代码复制进link链接后一定要在href=后面加上 http:
②在style里面在加上html { font-family: iconfont;}
③然后创建iconfont类盒子把对应unicode的代码放进去即可。
第二种:Font class
1.第一步,在阿里iconfont里复制链接。
2.第二步,在项目中用link链接复制进去,同样也是要注意一定要加http: ,不然就会显示成方框。在盒子的类名用iconfont icon-******(引用font class相应的代码)即可呈现。
标签:代码,iconfont,方框,阿里,Unicode,Font,class From: https://www.cnblogs.com/Juny-J/p/17010356.html