在做项目的时候,我们可能习惯性的会选择font-class类型
在这里插入图片描述
然后在线拷贝css文件,添加到项目文件中,结果到了app-plus时,发现还缺少ttf文件的引入

"buttons": [{
								"fontSrc": "/static/iconfont.ttf",
								"text": "\ue66e",
								"fontSize": "26",
								"color": "#fff",
								"float": "left",
								"background": "#fa436a"
							},
							{
								"fontSrc": "/static/iconfont.ttf",
								"text": "\ue744",
								"fontSize": "27",
								"color": "#fa436a",
								"background": "rgba(0,0,0,0.8)",
								"redDot": true
							}
						]

结果就去把之前的font-class的文件下载到本地,并拷贝到项目,结果还是老样子:

在这里插入图片描述
这主要是拷贝错了文件,ttf设置的只支持Unicode编码,所以要下载unicode的素材在这里插入图片描述

然后将iconfont.ttf文件拷贝至项目文件中,进行引入、使用,效果如下在这里插入图片描述
最后,再次提醒大家,我们得到的的iconfont.cssd的文件中content为5为数,在ttf使用中需要在\后加一个u在这里插入图片描述
在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐