阿里图标库字体图标使用方法

最新推荐文章于 2024-10-10 11:04:06 发布

原创最新推荐文章于 2024-10-10 11:04:06 发布 · 1.4k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

css 专栏收录该内容

4 篇文章

订阅专栏

本文详细介绍了如何使用阿里图标库，包括登录、选择图标、添加至项目、下载及前端页面引入的方法，适合初学者快速上手。

阿里图标库地址（https://www.iconfont.cn/）
1、打开阿里图标库的地址登录自己的github
2、查找自己需要的图标，点击加入购物车在这里插入图片描述
3、点击购物车，

4、可以添加至项目里面

5、点击确定

6、点击下载至本地，解压打开下载的文件

7、在前端页面里面引入当前css文件

8、代码以及效果图

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="./iconfont.css">
</head>
<body>
  <div class="iconfont icon-jian"></div>
  <div class="iconfont icon-fangshai"></div>
  <div class="iconfont icon-fendi"></div>
  <div class="iconfont icon-huazhuangshui"></div>
</body>
</html>

在这里插入图片描述