Font Awesome 的使用

前端精髓

共 592字,需浏览 2分钟

 ·

2022-06-29 20:47


之前一直使用的是 iconfont,阿里巴巴出品的一个字体图标库。但是最近 iconfont 不再支持 CDN 引入,只能本地下载,这样一来修改图标就非常的麻烦。


于是,就找了一个类似的图标库,现在使用的比较多的一个国外字体图标库。使用方式和iconfont有些不同。font awesome需要下载整个库。而阿里巴巴图标库可以定制下载。较为灵活。


使用 Font Awesome 需要先注册一下:

https://fontawesome.com/


然后同样支持多种方式引入,包括下载和 CDN 引入,通过 CDN 引入非常的方便那我们就选择 CDN 的方式。



点击 kits 按钮,进入工具页面,然后会有一个 CDN 地址,把这个地址添加到项目中即可。


<script src="https://kit.fontawesome.com/fff3aa0c8a.js" crossorigin="anonymous"></script>// 使用<i class="fa-solid fa-house"></i>


可以在网站中搜索任意想要的图标,需要注意的是有部分图标是收费,基本上来说免费的图标就已经够我们使用了,影响并不大。



当我们选择图标之后,就可以复制代码在项目中使用,而且无需修改 CDN 地址。



浏览 22
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报