在vue项目中正确使用iconfont的方法


Posted in Javascript onSeptember 28, 2018

1、打开 iconFont官网 选择自己喜欢的图标,并且添加购物车

2、点击购物车,添加至项目

3、下载至本地

在vue项目中正确使用iconfont的方法

4、把我们下载好的文件iconfont.css和iconfont.ttf放到项目assets文件夹下(可创建一个css文件或iconfont文件)

5、在main.js中引入iconfont.css样式

import './assets/iconfont/iconfont.css'

6、在在vue文件中引用<i class="iconfont

icon-zitigui-xianxing"></i>

7、假如报错,需要下载css-loader依赖包

npm install css-loader --save

以上这篇在vue项目中正确使用iconfont的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
动态控制Table的js代码
Mar 07 Javascript
js以对象为索引的关联数组
Jul 04 Javascript
js+JQuery返回顶部功能如何实现
Dec 03 Javascript
用innerhtml提高页面打开速度的方法
Aug 02 Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 Javascript
微信小程序中使用javascript 回调函数
May 11 Javascript
jQuery Validate格式验证功能实例代码(包括重名验证)
Jul 18 jQuery
基于Vue.js实现tab滑块效果
Jul 23 Javascript
jQuery模拟12306城市选择框功能简单实现方法示例
Aug 13 jQuery
JavaScript计算正方形面积
Nov 26 Javascript
js根据后缀判断文件文件类型的代码
May 09 Javascript
在js中修改html body的样式
Nov 11 Javascript
vue项目引入字体.ttf的方法
Sep 28 #Javascript
vue打包相关细节整理(小结)
Sep 28 #Javascript
在vue-cli的组件模板里使用font-awesome的两种方法
Sep 28 #Javascript
Vue 第三方字体图标引入 Font Awesome的方法
Sep 28 #Javascript
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
Sep 28 #Javascript
用npm安装vue和vue-cli,并使用webpack创建项目的方法
Sep 28 #Javascript
详解适配器在JavaScript中的体现
Sep 28 #Javascript
You might like
isset和empty的区别
2007/01/15 PHP
关于PHP堆栈与列队的学习
2013/06/21 PHP
php可扩展的验证类实例(可对邮件、手机号、URL等验证)
2015/07/09 PHP
图文详解phpstorm配置Xdebug进行调试PHP教程
2016/06/13 PHP
怎么让脚本或里面的函数在所有图片都载入完毕的时候执行
2006/10/17 Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
2012/09/14 Javascript
Javascript实现快速排序(Quicksort)的算法详解
2015/09/06 Javascript
jQuery-1.9.1源码分析系列(十一)DOM操作续之克隆节点
2015/12/01 Javascript
javascript每日必学之封装
2016/02/23 Javascript
jQuery中值得注意的trigger方法浅析
2016/12/12 Javascript
boostrapTable的refresh和refreshOptions区别浅析
2017/01/22 Javascript
微信小程序实现下拉框功能
2019/07/16 Javascript
简单了解微信小程序 e.target与e.currentTarget的不同
2019/09/27 Javascript
JS实现炫酷雪花飘落效果
2020/08/19 Javascript
Vue实现多页签组件
2021/01/14 Vue.js
[01:10]DOTA2亚洲邀请赛 征战号角响彻全场
2015/01/06 DOTA
[04:19]DOTA2完美大师赛第四天精彩集锦
2017/11/26 DOTA
[43:36]Liquid vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
[00:06]Yes,it worked!小卡尔成功穿越时空加入战场!
2019/07/20 DOTA
11个并不被常用但对开发非常有帮助的Python库
2015/03/31 Python
Python简单实现子网掩码转换的方法
2016/04/13 Python
剖析Python的Twisted框架的核心特性
2016/05/25 Python
详解django三种文件下载方式
2018/04/06 Python
使用Python的Dataframe取两列时间值相差一年的所有行方法
2018/07/10 Python
Python对HTML转义字符进行反转义的实现方法
2019/04/28 Python
详解KMP算法以及python如何实现
2020/09/18 Python
Spartoo葡萄牙鞋类网站:线上销售鞋履与时尚配饰
2017/01/11 全球购物
亚马逊意大利站点:Amazon.it
2020/12/31 全球购物
文明礼仪事迹材料
2014/01/09 职场文书
医药销售求职信范文
2014/02/01 职场文书
党员活动日总结
2014/05/05 职场文书
2015年商场工作总结
2015/04/27 职场文书
小学教师党员承诺书
2015/04/27 职场文书
2015年国培研修感言
2015/08/01 职场文书
Java 常见的限流算法详细分析并实现
2022/04/07 Java/Android
Java 使用类型为Object的变量指向任意类型的对象
2022/04/13 Java/Android