网址：https://icomoon.io/app/#/select；

特点：样式多，免费

操作：

1.相中的，随便点，不要钱，generat fonts然后download，得到一个压缩文件，解压，打开demo.html文件，在控制台可以看到每个标签的class名。

2，把style.css和font文件夹放到vue的static里（当然你也可以放在别的地方，只要vue里就可以）。

3，在vue的index.html里添加<link rel="stylesheet" href="static/style.css">引入；

4，此后，哪里需要图标，只要加个span标签，让它class名是你需要的标签的class名，他们就可以显示。

当然，你还可以在那网址上改标签，edit

vue中的图标字体引入的更多相关文章

  1. vue中使用svg字体图标

    1.在src/ 下面新建目录icons,里面新建文件夹svg,和文件index.js .svg用于存放从iconfont下载下来的svg格式的图标,index.js用于引入使用到svg文件和对应的组件 ...

  2. vue中使用特殊字体

    有时候为了个性化,可能需要为部分字体添加特殊的font-family 在static文件夹中创建font文件夹,内容如下: css内容如下: @font-face { font-family: vue ...

  3. iOS中iconfont(图标字体)的基本使用

    前言 近日在做项目时,项目组有提出iconfont的技术,便开始查询相关资料.iconfont技术的主要目的是为减少应用体积而生.首先icon代表图标 font代表字体.此技术便是将图标转化为字体,从 ...

  4. vue中svg图标使用

    在前端开发中,经常会用到svg图标,在vue开发的中,经常会借助一些第三方插件,经常用的有vue-svg-icon,基本使用步骤为: 1.安装插件(会提示没有安装xml-loader,只需要安装下xm ...

  5. vue中鼠标移入字体下面显示颜色并改变字体颜色的问题

    <template> <div class="smart_nav" :class="{'fixedTop':fixedTop}"> &l ...

  6. vue中引入字体文件

    在用vue来写一官网的时候,想引入外部字体文件,毕竟总感觉他自己的字体有点难看,在这里记录下 1.先下载字体文件所需的.ttf文件 我这里想引入的是华文行楷字体 百度后下载了一个3M多的ttf文件 2 ...

  7. 学习WPF——使用Font-Awesome图标字体

    图标字体介绍 在介绍图标字体之前,不得不介绍图标格式ICON ICON是一种图标格式,我们操作系统中各种应用程序都包含一个图标 比如QQ程序的图标是一个可爱的企鹅,我的电脑是一个显示器图标 ----- ...

  8. 老爷车IE8如何兼容图标字体

    前言 首先这个标题再详细的说就是如何解决font-face在IE8下间歇性出现图标字体渲染失败的解决方案. 如果你还不知道什么是图标字体,可以先阅读:链接1,链接2,链接3 先看在IE8下的问题: 而 ...

  9. 图标字体的使用(fontello.com)字体推荐及使用技巧

    网页设计中为了页面漂亮好看,图标是少不了,网页中使用的图标通常都是使用图片,使用图片图标的有很多弊端,如果你经常制作网页应该有一肚子埋怨. 使用图片图标的弊端 放大图标必须重新作图, 改变颜色必须开启 ...

随机推荐

  1. SOLDI原则之DIP：依赖倒置原则

    本篇介绍软件设计原则之一DIP:依赖倒置原则.很多知识回头来看会有新的理解.看到一句话,一段文字,一个观点有了新的理解,醍醐灌顶的感觉.这种感觉像是一种惊喜.古语说:温故而知新. DIP:依赖倒置原则 ...

  2. C# Parallel.Invoke 实现

    Parallel.Invoke应该是Parallel几个方法中最简单的一个了,我们来看看它的实现,为了方法大家理解,我尽量保留源码中的注释: public static class Parallel ...

  3. [Canvas]空战游戏进阶 增加己方子弹管理类

    点此下载源码,可用Chrome打开观看. 图例: 代码: <!DOCTYPE html> <html lang="utf-8"> <meta http ...

  4. 修改Electron的libcc(libchromiumcontent)源码，重新编译electron， 设置event.isTrusted为true

    VPN非常注意: 编译的过程需要使用VPN, 否者chromium的源代码无法下载, 后面会出现总总问题 Electron的编译环境, 推荐使用物理机: win10 64位 英文版, 为了避免后期出现 ...

  5. shell编程学习笔记（十一）：Shell中的while/until循环

    shell中也可以实现类似java的while循环 while循环是指满足条件时,进行循环 示例: #! /bin/sh index=10 while [ $index -gt 0 ] do inde ...

  6. 机器人关节空间轨迹规划--S型速度规划

    关节空间 VS 操作空间 关节空间与操作空间轨迹规划流程图如下(上标$i$和$f$分别代表起始位置initial和目标位置final): 在关节空间内进行轨迹规划有如下优点: 在线运算量更小,即无需进 ...

  7. vs visual stdio 调试 显示指针为数组

    假如有这样一个指针 int *  idx16  那么要想在调试里面显示为数组并且要显示的数组元素个数为24的话,则要写成idx16,24 如下图

  8. 评分卡模型剖析之一（woe、IV、ROC、信息熵）

    信用评分卡模型在国外是一种成熟的预测方法,尤其在信用风险评估以及金融风险控制领域更是得到了比较广泛的使用,其原理是将模型变量WOE编码方式离散化之后运用logistic回归模型进行的一种二分类变量的广 ...

  9. jmeter 执行python脚本

    jmeter 可以通过Jython 执:行python代码 1.下载Jython jar包:http://www.jython.org/downloads.html 2.把下载的Jython 的jar ...

  10. Unity应用架构设计(2)——使用中介者模式解耦ViewModel之间通信

    当你开发一个客户端应用程序的时候,往往一个单页会包含很多子模块,在不同的平台下,这些子模块又被叫成子View(视图),或者子Component(组件).越是复杂的页面,被切割出来的子模块就越多,子模块 ...