第一步:进入阿里巴巴矢量图网站:http://www.iconfont.cn/

 
阿里巴巴矢量图

第二步:搜索你分类的关键字---然后加入购物车,下载到本地,然后解压,会将合并后的字体文件及自动生成的css全部下载

 
 
解压后的文件
 
第三步:打开demo_index.html,里面有刚才你选择的icon图标

 
 
第四步:从三种模式中选择一种  按照选择那种的步骤进行操作
 
我选择的是Symbol彩色的那种

效果展示:

另外两种也可以按着步骤来

注意:

IconFont 图标的3种引用方式的更多相关文章

  1. iconfont_3种引用方式

    IconFont 图标的3种引用方式   新版Iconfont-阿里巴巴矢量图标库支持三种引用方式: 1.unicode引用(原始) unicode是字体在网页端最原始的应用方式,特点是: 兼容性最好 ...

  2. echars画折线图的一种数据处理方式

    echars画折线图的一种数据处理方式 <!DOCTYPE html> <html> <head> <meta charset="utf-8&quo ...

  3. JAVA四种引用方式

    JAVA四种引用方式: java.lang.ref: 强引用(直接变量赋值) 软引用(SoftReference): 只有在要发生OOM错误之前才会回收掉老的软引用对象,应用场景主要防止内存溢出.(缓 ...

  4. Java 8 的新特性和Java 的4种引用方式

    一.接口的增强 Java 8允许我们给接口添加一个非抽象的方法实现,只需要使用 default关键字即可,这个特征又叫做扩展方法,示例如下: interface Formula { double ca ...

  5. css 三种引用方式

    内联式 代码 <!doctype html> <html lang="en"> <head> <meta charset="UT ...

  6. class类名在webpack项目中的两种引用方式

    一.问题描述 在项目工程中,我们通常既用到css module,也用到普通的less文件引用方式,代码及webpack配置如下,运行时,发现只有css module起作用,如何让两者都起作用呢? // ...

  7. Java的四种引用方式

    一.引用基本概念 从JDK1.2版本开始,把对象的引用分为四种级别,从而使程序能更加灵活的控制对象的生命周期.这四种级别由高到低依次为:强引用.软引用.弱引用.虚引用. 1.强引用(StrongRef ...

  8. css的两种引用方式 link和@import

    学习web开发的最大乐趣就是不断的发现自己以前不曾见过的东西,这些东西对于我来说是那么的新鲜有趣. 比如说今天偶尔研究别人的网站,就发现了有趣的东东. 当点开此网页的css时(这个css文件命名方式就 ...

  9. Java中的四种引用方式

      无论是通过引用计数算法判断对象的引用数量,还是通过可达性分析算法判断对象的引用链是否可达,判定对象是否存活都与"引用"有关.在Java语言中,将引用又分为强引用.软引用.弱引用 ...

随机推荐

  1. cordova 配置 高德地图sdk定位

    获取 sha1 打开 cmd 1. cd .android 2. keytool -list -v -keystore debug.keystore 3. 输入密钥: android 4. 复制 sh ...

  2. win10居然把Linux的引导覆盖了

    昨天晚上装了个windows10系统试了试,发现触摸板真的难用.最基本的双指点击做右键都搞不出来,开始菜单里要上下滚动的时候触摸板竟然要水平滑动-- 重启的时候发现居然没有Linux的引导选项了 试了 ...

  3. Jenkins企业应用进阶详解(一)

    Jenkins企业应用进阶详解(一) 链接:https://pan.baidu.com/s/1NZZbocZuNwtQS0eGkkglXQ 提取码:z7gj 复制这段内容后打开百度网盘手机App,操作 ...

  4. 群晖修改启用root账号密码

    DSM6.0以后,官方修改了系统的ROOT密码;需要修改才能启用并使用 软件准备 PUTTY点击下载 DSM中开启SSH 控制面板-终端机和SNMP-启动SSH 打开PUTTY 输入DSM IP地址 ...

  5. eclipse中server location为灰色,不能修改

    当自己用eclipse写好了web项目后,也同时配置了服务器(tomcat6), 上面部署完毕后,直接访问http://localhost:8080 发现是 无法访问的,这是因为,Servers这里的 ...

  6. Kirinriki

    Kirinriki 定义两个长度相等的字符串\(\{a_i\},\{b_i\}\)的距离为\(\sum_{i=1}^n|a_i-b_{n-i+1}|\)(其中n为字符串的长度),给出一个字符串\(\{ ...

  7. Delphi GlobalAlloc、GlobalLock、GlobalUnlock、GlobalFree 函数

    GlobalAlloc 函数 分配一块内存,该函数会返回分配的内存句柄. GlobalLock 函数 锁定内存块,该函数接受一个内存句柄作为参数,然后返回一个指向被锁定的内存块的指针. 您可以用该指针 ...

  8. springCloud参考资料

    官网: http://spring.io/projects/spring-cloud 各组件说明(中文版):https://springcloud.cc/spring-cloud-netflflix. ...

  9. sql 修改数据

    关系数据库的基本操作就是增删改查,即CRUD:Create.Retrieve.Update.Delete.其中,对于查询,我们已经详细讲述了SELECT语句的详细用法. 而对于增.删.改,对应的SQL ...

  10. js设计模式——2.外观模式

    js设计模式——2.外观模式