其他分享
首页 > 其他分享> > 图标字体使用

图标字体使用

作者:互联网

阿里巴巴矢量图标库

下载图标库

  1. 登陆图标库,链接: https://www.iconfont.cn/
  2. 选择所需的图标库,将所需的图标添加入库在这里插入图片描述
  3. 点击右上角购物车图标在这里插入图片描述
  4. 选择下载代码在这里插入图片描述
  5. 解压下载的文件,将红框文件复制到项目中在这里插入图片描述

使用图标库
下载下来的文件包中的demo_index.html在浏览器中打开,可以看到使用参考信息。
在这里插入图片描述

1、第一种使用方式

<span class="iconfont">&#xe664;</span>
<span class="iconfont">&#xe666;</span>

2、第二种使用方式

<span class="iconfont icon-arrow-down"></span>
<span class="iconfont icon-bottom"></span>

3、第三种使用方式

.ali-icon::before {
    content: '\e666';
    font-family: 'iconfont';
    font-size: 100px;
}
<span class="ali-icon"></span>

在这里插入图片描述

标签:图标库,iconfont,字体,使用,font,下载,图标
来源: https://blog.csdn.net/qq_33242956/article/details/121608559