今天看iconfont的使用视频,有点断片,记得基础班没有讲过,可能是资源丢掉了,总结一下使用过程。
下面是网站地址
https://www.iconfont.cn/
使用需要登录账号,可以使用github或者微博账号登录,在右上角第一个小图标。
2. 选择自己需要的图标,先随便选中一个进行演示。(引入下面的资源)
点进去之后,鼠标移动上去,点击购物车图标
这样子的话,右上角的购物车里面就会显示出数量
3. 选择完毕之后,就点击一下小购物车
选择添加到项目(第一次使用的话需要新建一个项目,根据自己的需求制作就可以)
点击之后就会跳转到下面网页
4. 选择下载至本地,之后进行解压处理。
新建一个文件夹,将解压好的文件夹放入进去,之后新建的文件夹用哪个vscode打开。
5. 同级建一个.html文件
引入.css文件
<link rel="stylesheet" href="./font_2764063_nwtt8o6lbc/iconfont.css">
写图标类名:复制代码
写入类名(第一个必须是.iconfont 第二个是自己选的图标)
测试
演示2
补充:修改颜色+大小