1.第一步在样式里声明字体:告诉别人我们自己定义的字体。

@font-face{  /*声明字体 引用字体*/
font-family:'icomoon';
src:url('fonts/icomoon.eot');
src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
url('fonts/icomoon.woff') format('woff'),
url('fonts/icomoon.ttf') format('truetype'),
url('fonts/icomoon.svg#SofiaProLight') format('svg');
font-weight:normal;
font-style:normal; } 2.第二步给盒子使用字体
span{
font-family: icomoon;
}


3.盒子里面添加结构

span::{

}

<span></span>


icomoon字体图标引用代码的更多相关文章

  1. 如何使用IcoMoon字体图标

    如何使用IcoMoon字体图标 一,字体图标工具: 1.登录字体图标网站:https://icomoon.io/app/#/select 2.Svg在线编辑工具:https://c.runoob.co ...

  2. Android iconfont字体图标的使用

    1.首先,进入阿里的矢量图标库,在这个图标库里面可以找到很多图片资源,当然了需要登录才能下载或者使用,用GitHub账号或者新浪微博账号登录都可以 2.登录以后,可以搜索自己需要的资源,然后直接下载使 ...

  3. 微信小程序使用字体图标

    项目中常常需要使用到字体图标,微信小程序中使用字体图标与在平常的web前端中类似但是又有区别.下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标. 第一步:下载需要的字体图标 进入阿里图标官网 ...

  4. 如何在微信小程序中使用阿里字体图标

    第一步:下载需要的字体图标 进入阿里图标官网http://iconfont.cn/搜索自己想要的图标. 如这里需要一个购物车的图标,流程为: 搜索“购物车”图标 --->  点击“添加入库”  ...

  5. 字体图标库 IcoMoon IconFont Font Awesome的使用

    在项目开发的过程中,我们会经常用到一些图标.但是我们在使用这些图标时,往往会遇到失真的情况,而且图片数量很多的话,页面加载就越慢.所以,我们可以使用字体图标的方式来显示图标,字体图标任意放大缩小不会失 ...

  6. 使用icomoon把svg图片生成字体图标

    今天看了使用icomoon来将svg转换成图标字体,本来是不会使用别人给的svg,也不清楚具体的好处是什么,查了svg以后,越来越懵,svg挺好的为什么要转成图标字体呢. 一.SVG介绍 SVG 是一 ...

  7. vue之placeholder中引用字体图标

    先说一下问题:在placeholder中想使用字体图标,结果渲染不正确,代码如图 效果如图 在网上get到了解决方法: 在VUE组件中,给placeholder添加图标,需要注意以下几点: 1.不要给 ...

  8. 详解使用icomoon生成字体图标的方法并应用

    原文:http://blog.csdn.net/u013938465/article/details/50680468 最近项目大量用到字体图标,大家也知道,字体图标任意缩放不会失真,也大大减少请求数 ...

  9. icomoon:生成字体图标的方法并应用

    字体图标任意缩放不会失真,也大大减少请求数量,非常好用. 在线生成工具:https://icomoon.io/app/#/select 在线SVG图库(阿里),  用于导入:http://www.ic ...

随机推荐

  1. error: device unauthorized.

    1 执行 adb install   com.taobao.taobao_250.apk 报错 2 先看手机是不是未授权,执行命令之后,手机回弹出授权信息,点击确认就行了

  2. OAuth_1

    OAuth2.0是一个应用之间彼此访问数据的开源授权协议.比如,一个游戏应用可以 访问Facebook的用户数据.用户访问web游戏应用,该游戏应用要求用户通过Facebook 登录.用户登录到Fac ...

  3. 77th ploty 制图神器

    https://blog.csdn.net/u012897374/article/details/77857980

  4. Vue中app实例对象的几种写法

    1.传统方法(练习 小DEMO中用的这种) <script type="text/ecmascript"> var app=new Vue({ el:"#ap ...

  5. OS---磁盘存储器

    1.概述 1.1 磁盘存储器  不仅  容量大.存取速度快  而且  可以随机存取: 现代计算机都配置了  磁盘存储器,以  它  为主  存放文件: 对文件 的操作,都将涉及对磁盘的访问: 1.2 ...

  6. django 邮箱发送

    在django中提供了邮件接口 QQ邮箱配置 qq邮箱地扯:https://mail.qq.com settings文件 # 邮箱配置 EMAIL_USE_SSL = True EMAIL_HOST ...

  7. 深入了解 Flink 网络栈(二):监控、指标和处理背压

    在之前的文章中,我们从高级抽象到底层细节各个层面全面介绍了 Flink 网络栈的工作机制.作为这一系列的第二篇文章,本文将在第一篇的基础上更进一步,主要探讨如何监视与网络相关的指标,从而识别背压等因素 ...

  8. 【Flutter学习】之动画实现原理浅析(二)

    1. 介绍 本文会从代码层面去介绍Flutter动画,因此不会涉及到Flutter动画的具体使用. 1.1 Animation库 Flutter的animation库只依赖两个库,Dart库以及phy ...

  9. 安装ISS服务

    二个操作系统 http://jingyan.baidu.com/article/5552ef471dcdd5518efbc976.html(win7)

  10. MySQL导入导出数据和表结构 source和mysqldump

    MySQL导入数据的方式: 1.使用source /dir/test.sql导入数据进入数据库:查询数据库编码格式show variables like "%char%";设置编码 ...