挑选图标的过程(共6步)

  1. 进入网站:Iconfont网址:http://www.iconfont.cn
  2. 点击网站上方的“官方图标库”,选择自己喜欢的图标。在这里我选择天猫的图标库。
  3. 选择好自己喜欢的图标,你可以有两个选择,下载代码 和 添加至项目。
  4. 我们这两选择添加至项目,然后新建项目,并输入名称。
  5. 项目添加好后,会自动给我们转入到我们项目库中。点击查看在线链接。
  6. 生产css引入的代码,生成后就可以在项目首页index.html引入了。
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_wyhhdpv5lhvbzkt9.css">

图标的使用:

图标顺利引入到项目中,已经可以使用它们了,在“我的项目中”你会看到图标的font class值。可以直接复制代码粘贴,也可以自己写代码。

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

  在各个组件中就可以使用了

这样在页面中就可以看到图标了。

iconFont 阿里巴巴矢量图标使用方法的更多相关文章

  1. iconfont阿里巴巴矢量图标库批量保存

    F12输入——var iconList = document.querySelectorAll('.icon-gouwuche1');for (var i = 0; i < iconList.l ...

  2. 微信小程序引用阿里巴巴矢量图标iconfont

    最近在写微信小程序,但是引用图片,导致项目文件太大,所以就想到引用阿里巴巴矢量图标的方法 第一步:下载阿里巴巴矢量图代码: 第二步:将下载下来的文件中iconfont.ttf转换即可.转换地址:htt ...

  3. 阿里巴巴矢量图标库(iconfont)批量全选的方法

    阿里巴巴矢量图标库: https://www.iconfont.cn/ 浏览器打开调试面板,进入 console 调试面板(Google浏览器快捷键F12)或者在页面空白处,点击右键->审查元素 ...

  4. [RN] React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题

    React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题 解决方法: 添加 size,  line-height ,值为和 height 一样的高度. 例如: ...

  5. [RN] React Native 使用 阿里巴巴 矢量图标库 iconfont

    React Native 使用 阿里巴巴 矢量图标库 iconfont 文接上文: React Native 使用精美图标库react-native-vector-icons 本文主要讲述 如何 使用 ...

  6. MUI框架-14-使用自定义icon图标、引入阿里巴巴矢量图标

    MUI框架-14-使用自定义icon图标.引入阿里巴巴矢量图标 首先介绍介绍一下,前端必备的非常强大的 阿里巴巴矢量图标库:地址是:http://www.iconfont.cn/ 这里有丰富,精美,且 ...

  7. 阿里巴巴矢量图标的使用Demo

    一.html网页的使用步骤: 1. 登录进入阿里巴巴矢量图标库中,选择自己喜欢的图标,放到购物车,http://www.iconfont.cn/plus/manage/index?manage_typ ...

  8. IconFont --阿里巴巴矢量库

    超多的图标网站,可自己设置颜色,然后下载. IconFont --阿里巴巴矢量库

  9. 微信小程序里使用阿里巴巴矢量图标

    登录 阿里巴巴矢量图标 (https://www.iconfont.cn) 选中图标,加入购物车图标 下载源代码 解析出来如下文件结构 有两种使用方式: 1)不转换成base64的文件 找到 icon ...

随机推荐

  1. 什么是 better-scroll(转自知乎网 : 黄轶)

    什么是 better-scroll better-scroll 是一个移动端滚动的解决方案,它是基于 iscroll 的重写,它和 iscroll 的主要区别在这里.better-scroll 也很强 ...

  2. shell脚本显示当前主机系统信息

    编写脚本/root/bin/systeminfo.sh, 当前主机系统信息,包括主机名,IPv4地址,操作系统版本,内核版本,CPU型号,内存大小,硬盘大小. vim /root/bin/system ...

  3. 关于Django中JsonResponse返回中文字典编码错误的解决方案

    解决方案:JsonResponse(data, json_dumps_params={'ensure_ascii':False}) ! data是需要渲染的字典 def master(request) ...

  4. mysql 支持四字节设置

    设置文件mysql/bin/my.ini[mac用户在ect文件夹里创建文件my.cnf] 添加以下代码: [mysqld] character-set-server=utf8mb4

  5. 09JavaScript函数

    函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. 实例1: <!DOCTYPE html> <html> <head> <meta charset ...

  6. UEditor代码实现高亮显示

    在公司开发一个论坛系统,由于用的是UEditor(百度编辑器),单独使用的话,里面的代码不会高亮,网上找了很多,最后决定使用 highlight.js 实现代码高亮显示.效果如下: 这个是我修改其他的 ...

  7. 利用cross-entropy cost代替quadratic cost来获得更好的收敛

    1.从方差代价函数说起(Quadratic cost) 代价函数经常用方差代价函数(即采用均方误差MSE),比如对于一个神经元(单输入单输出,sigmoid函数),定义其代价函数为: 其中y是我们期望 ...

  8. Milking Order

    Milking Order 题意:给出m个描述状态,其中包含若干个边的关系,问最多能取x (x<=m)个状态,使得形成的图没有环.就是说取x个状态,用状态中的关系建边,其中不能有环. 题解:最大 ...

  9. 【BZOJ3991】寻宝游戏(动态规划)

    [BZOJ3991]寻宝游戏(动态规划) 题面 BZOJ 题解 很明显,从任意一个有宝藏的点开始,每次走到相邻的\(dfs\)的节点就行了. 证明? 类似把一棵树上的关键点全部标记出来 显然是要走一个 ...

  10. 绝地求生大逃杀BE启动失败,应用程序无法正常启动

    今日更新绝地求生大逃杀后部分客户反馈绝地求生点击启动提示BE安装,应用程序无法启动 问题原因:经过排查发现,客户开启过超级工作站运行过游戏,在系统镜像包中保留了旧版的BE服务,致使新版BE无法安装,冲 ...