前端引用字体

比如引用icomoon.io网上免费的字体:

1.选中需要的免费的字体:


双击即选中,再次点击即取消

2.下载这些选中的字体:点击最下面的按钮:

点击即可看到你选中的字体:

点击Download按钮即下载,等待下载完即下载完成

3.在页面引用,在你的项目创建font文件夹,将下载的资源里面中的fonts文件夹中的文件全部复制到你创建的font文件夹中,将style.css文件夹全部复制到你的全局样式中(记得是style.css文件中全部代码,否则会出现引用失败):

①使用fontCreator编辑器打开icomoon.woff文件,可以看到具体的图标信息,及图标的名字(这个很重要):


②在你的全局样式文件中可以看到你添加的代码,(为啥是在全局样式文件中定义,以为你有可能其他页面都要引用)如:(正常的情况下名字都不用修改,直接在页面中引用下面字体的名字即可(如下面代码中字体的名字:icon - close)):


③页面中引用:


④完成:


注意:如果引入的字体太小,可以通过css中的字体属性来改变该引用字体的大小


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值