Vue 第三方字体图标引入 Font Awesome的方法


Posted in Javascript onSeptember 28, 2018

Font Awesome

用过Bootstrap字体图符的小伙伴肯定很熟悉字体图符的便利,不管是在加载还是修改方面,字体图符远远优于图片。但是饿了吗封装的Element UI提供的字体图符少之又少,又不想用图片,只能自己扩展图符咯。

Font Awesome 提供了675个可缩放的矢量图标,可以使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。还有很多优点不一一举例,可自行查看文档:http://fontawesome.dashgame.com/

npm 安装 font-awesome

npm install font-awesome --save-dev1

font-awesome引入

在 mani.js 文件中引入 font-awesome

import 'font-awesome/scss/font-awesome.scss'1

然后在组件中使用即可实现:

<span class="fa fa-camera-retro fa-lg"></span>

以上这篇Vue 第三方字体图标引入 Font Awesome的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript之对系统的toFixed()方法的修正
May 08 Javascript
使用IE6看老赵的博客 jQuery初探
Jan 17 Javascript
jquery 简单的进度条实现代码
Mar 11 Javascript
javascript中的float运算精度实例分析
Aug 21 Javascript
JS弹出对话框返回值代码(asp.net后台)
Dec 28 Javascript
Jquery选中或取消radio示例
Sep 29 Javascript
简单谈谈React中的路由系统
Jul 25 Javascript
浅谈vue.js导入css库(elementUi)的方法
Mar 09 Javascript
vue+element实现表单校验功能
May 20 Javascript
JS中的模糊查询功能
Dec 08 Javascript
使用Bootstrap做一个朝代历史表
Dec 10 Javascript
element tree树形组件回显数据问题解决
Aug 14 Javascript
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
Sep 28 #Javascript
用npm安装vue和vue-cli,并使用webpack创建项目的方法
Sep 28 #Javascript
详解适配器在JavaScript中的体现
Sep 28 #Javascript
在微信小程序中渲染HTML内容的方法示例
Sep 28 #Javascript
Vue父子组件之间的通信实例详解
Sep 28 #Javascript
vue引入axios同源跨域问题
Sep 27 #Javascript
解决vue-cli脚手架打包后vendor文件过大的问题
Sep 27 #Javascript
You might like
php 生成签名及验证签名详解
2016/10/26 PHP
利用PHP生成CSV文件简单示例
2016/12/21 PHP
YII2框架中actions的作用与使用方法示例
2020/03/13 PHP
用jQuery实现一些导航条切换,显示隐藏的实例代码
2013/06/08 Javascript
js导出table数据到excel即导出为EXCEL文档的方法
2013/10/10 Javascript
javascript动画算法实例分析
2015/07/31 Javascript
jquery结婚电子请柬特效源码分享
2015/08/21 Javascript
JavaScript简单遍历DOM对象所有属性的实现方法
2015/10/21 Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
2016/05/17 Javascript
gulp-htmlmin压缩html的gulp插件实例代码
2016/06/06 Javascript
js实现图片淡入淡出切换简易效果
2016/08/22 Javascript
详解基于javascript实现的苹果系统底部菜单
2016/12/02 Javascript
js实现复选框的全选和取消全选效果
2017/01/03 Javascript
浅谈Angular 观察者模式理解
2018/11/01 Javascript
Vue 图片压缩并上传至服务器功能
2020/01/15 Javascript
通过实例解析jQ Ajax操作相关原理
2020/09/23 Javascript
[40:03]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#1EHOME VS Archon
2016/03/02 DOTA
[54:57]DOTA2-DPC中国联赛定级赛 Aster vs DLG BO3第二场 1月8日
2021/03/11 DOTA
Python实现曲线点抽稀算法的示例
2017/10/12 Python
Python3实现获取图片文字里中文的方法分析
2018/12/13 Python
解决pycharm 工具栏Tool中找不到Run manager.py Task的问题
2019/07/01 Python
构建高效的python requests长连接池详解
2020/05/02 Python
Keras实现支持masking的Flatten层代码
2020/06/16 Python
Python Pygame实现俄罗斯方块
2021/02/19 Python
基于canvas使用贝塞尔曲线平滑拟合折线段的方法
2018/01/10 HTML / CSS
Trina Turk官网:美国时装和泳装品牌
2018/06/10 全球购物
满月酒答谢词
2014/01/14 职场文书
2014升学宴答谢词
2014/01/26 职场文书
大学新生军训感言
2014/02/25 职场文书
项目建议书范文
2014/05/12 职场文书
幼儿园个人总结
2015/02/28 职场文书
企业工会工作总结2015
2015/05/13 职场文书
python使用openpyxl库读写Excel表格的方法(增删改查操作)
2021/05/02 Python
分布式锁为什么要选择Zookeeper而不是Redis?看完这篇你就明白了
2021/05/21 Redis
mybatis3中@SelectProvider传递参数方式
2021/08/04 Java/Android
CSS作用域(样式分割)的使用汇总
2021/11/07 HTML / CSS