如何使用icomoon图标

如何使用icomoon图标

在做页面的时候常常需要各种好看的图标来丰富页面,常见的有Iconfont阿里巴巴矢量图标库icomoon等等。我最常用的就是icomoon,所以今天就来说一下icomoon的用法。

  1. 首先打开 icomoon 的官网
  2. 点击右上角,进入IcoMoon App
    在这里插入图片描述
  3. 进入后,单击选择你想要的图标
    在这里插入图片描述
  4. 选择完成后,点击底部导航栏的 Generate Font在这里插入图片描述
  5. 跳转页面后,选择右下角的Download在这里插入图片描述
  6. 将下载后的压缩包打开,将里面的fonts文件夹和style.css拷贝到你项目下在这里插入图片描述
  7. 打开style.css文件,复制第一段代码,如图 (这一步也可替代将style.css直接引入页面中,就不用复制代码)在这里插入图片描述
    而后,即可在页面上引用
  8. 引用方法:
    在这里插入图片描述
    在这里插入图片描述
  • 在html代码中引用:
    在这里插入图片描述
    结果:在这里插入图片描述
  • 在css中引用
    在这里插入图片描述
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值