前端引用字体
比如引用icomoon.io网上免费的字体:
1.选中需要的免费的字体:
双击即选中,再次点击即取消
2.下载这些选中的字体:点击最下面的按钮:
,
点击即可看到你选中的字体:
点击Download按钮即下载,等待下载完即下载完成
3.在页面引用,在你的项目创建font文件夹,将下载的资源里面中的fonts文件夹中的文件全部复制到你创建的font文件夹中,将style.css文件夹全部复制到你的全局样式中(记得是style.css文件中全部代码,否则会出现引用失败):
①使用fontCreator编辑器打开icomoon.woff文件,可以看到具体的图标信息,及图标的名字(这个很重要):
②在你的全局样式文件中可以看到你添加的代码,(为啥是在全局样式文件中定义,以为你有可能其他页面都要引用)如:(正常的情况下名字都不用修改,直接在页面中引用下面字体的名字即可(如下面代码中字体的名字:icon - close)):
③页面中引用:
④完成:
注意:如果引入的字体太小,可以通过css中的字体属性来改变该引用字体的大小