如何在Vu中引入 Font Awesome

如何在Vu中引入 Font Awesome?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

vue是什么

Vue是一套用于构建用户界面的渐进式JavaScript框架,Vue与其它大型框架的区别是,使用Vue可以自底向上逐层应用,其核心库只关注视图层,方便与第三方库和项目整合,且使用Vue可以采用单文件组件和Vue生态系统支持的库开发复杂的单页应用。

如何在Vu中引入 Font Awesome

Font Awesome

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

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

npm 安装 font-awesome

npminstallfont-awesome--save-dev1

font-awesome引入

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

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

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

<spanclass="fafa-camera-retrofa-lg"></span>

关于如何在Vu中引入 Font Awesome问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注恰卡编程网行业资讯频道了解更多相关知识。

发布于 2021-05-10 20:39:14
收藏
分享
海报
0 条评论
167
上一篇:如何在vue中引入vue-beauty 下一篇:在vue 中引入子组件出现报错如何解决
目录

    0 条评论

    本站已关闭游客评论,请登录或者注册后再评论吧~

    忘记密码?

    图形验证码