iconfont收藏心使用方法

1,百度iconfont,找到阿里巴巴矢量图标库官网,然后注册登录,或者用github登录也行,此步骤跳过;

2,找到图标管理->我的项目->然后新建项目:

3,项目新建完成后,往项目里添加我们要想使用的图标,找到图标库,搜索一个想要的图标,然后添加到购物车;

4,添加到购物车完成后,购物车徽章数字应该显示1了,点击右上角的购物车图标,选择添加至项目,选择我们刚刚创建的项目,确定;

5,接下来一部比较关键,将打包好的字体文件下载到本地添加到你的项目中,在项目中引用文件中的iconfont.css文件;

6,:到了最后一步了,如何在项目中使用字体图标呢,其实很简单,创建一个i标签或者span标签,添加两个类名,一个固定的是iconfont,另一个是你想要的那个图标对应的类名:


CSS部分


.icon-shixin{

    font-size: 18px;

    color:red;

    }

    .icon-kongxin{

    font-size: 18px;

    color:red;

    }

DIV部分

<div class="iconfontclass">

  <i class="iconfont icon-shixin"> </i>

  <i class="iconfont icon-kongxin"> </i>

  </div>

引入

<link rel="stylesheet" href="${request.contextPath}/statics/css/iconfont/iconfont.css">

https://www.cnblogs.com/hjvsdr/p/6639649.html



在原有的基础上再次修改

https://blog.csdn.net/DreamITEffort/article/details/84581317

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容