Vue 第三方字體圖標(biāo)引入 Font Awesome的方法
Font Awesome
用過Bootstrap字體圖符的小伙伴肯定很熟悉字體圖符的便利，不管是在加載還是修改方面，字體圖符遠(yuǎn)遠(yuǎn)優(yōu)于圖片。但是餓了嗎封裝的Element UI提供的字體圖符少之又少，又不想用圖片，只能自己擴(kuò)展圖符咯。
Font Awesome 提供了675個(gè)可縮放的矢量圖標(biāo)，可以使用CSS所提供的所有特性對它們進(jìn)行更改，包括：大小、顏色、陰影或者其它任何支持的效果。還有很多優(yōu)點(diǎn)不一一舉例，可自行查看文檔：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
然后在組件中使用即可實(shí)現(xiàn)：
<span class="fa fa-camera-retro fa-lg"></span>
以上這篇Vue 第三方字體圖標(biāo)引入 Font Awesome的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue中Element的table多選表格如何實(shí)現(xiàn)單選
這篇文章主要介紹了Vue中Element的table多選表格如何實(shí)現(xiàn)單選，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-07-07
vue實(shí)現(xiàn)動(dòng)態(tài)列表點(diǎn)擊各行換色的方法
今天小編就為大家分享一篇vue實(shí)現(xiàn)動(dòng)態(tài)列表點(diǎn)擊各行換色的方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
在 Vue 應(yīng)用中使用 Netlify 表單功能的方法詳解
Netlify 帶有內(nèi)置表單處理功能，可以用來存儲(chǔ)表單數(shù)據(jù)，下載 csv 文件，同時(shí)可以在接收到新的提交時(shí)發(fā)送郵件通知或者通過配置 webhook 發(fā)送請求。這篇文章主要介紹了在 Vue 應(yīng)用中使用 Netlify 表單功能,需要的朋友可以參考下2019-06-06
這篇文章主要介紹了解決vue無法偵聽數(shù)組及對象屬性的變化問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
vue項(xiàng)目中使用html2canvas解決截圖不全的問題
本文主要介紹了vue項(xiàng)目中使用html2canvas解決截圖不全的問題2023-11-11
vue 動(dòng)態(tài)添加的路由頁面刷新時(shí)失效的原因及解決方案
這篇文章主要介紹了vue動(dòng)態(tài)添加的路由頁面刷新時(shí)失效的原因及解決方案，幫助大家更好的理解和學(xué)習(xí)使用vue，感興趣的朋友可以了解下2021-02-02
隨著現(xiàn)在vue3越來越普及，相應(yīng)的面試題也多了起來。說到vue3的面試題，有一個(gè)最經(jīng)典的就是對于實(shí)現(xiàn)ref和reactive這兩個(gè)方法的底層原理，本文就來和大家簡單講講吧2023-04-04
Vue.js?前端項(xiàng)目在常見?Web?服務(wù)器上的部署配置過程
Web服務(wù)器支持多種編程語言，如 PHP，JavaScript，Ruby，Python 等，并且支持動(dòng)態(tài)生成 Web 頁面，這篇文章主要介紹了Vue.js?前端項(xiàng)目在常見?Web?服務(wù)器上的部署配置,需要的朋友可以參考下2023-02-02
在Vue項(xiàng)目中集成和使用Lottie動(dòng)畫庫的步驟詳解
Lottie 是一個(gè)由 Airbnb 開源的動(dòng)畫庫,它允許你在 Web、iOS、Android 等平臺(tái)上使用體積小、高性能的體驗(yàn)豐富的矢量動(dòng)畫,本文將詳細(xì)介紹在 Vue 項(xiàng)目中如何集成和使用 Lottie,文中有詳細(xì)的代碼講解,需要的朋友可以參考下2023-11-11
基于Vue2實(shí)現(xiàn)數(shù)字縱向滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了如何基于Vue2實(shí)現(xiàn)數(shù)字縱向滾動(dòng)效果,從而達(dá)到顯示計(jì)時(shí)器滾動(dòng)效果,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-03-03