vue如何使用外部特殊字體的操作
話不多說(shuō)先看效果:
我這里使用的是“優(yōu)設(shè)標(biāo)題這種字體”,接下來(lái)就是實(shí)現(xiàn)步驟了:
1、先在百度上下載所需要的字體ttf文件
2、在src文件夾新建common文件夾再建 font文件夾
3、在font文件夾里新建 font.css文件,以及把下載好的ttf文件放入
font.css內(nèi)容如下
4、在App.vue的style里引入font.css文件
5、在需要用到特殊字體的地方,把 font-family:”自定義字體名”,這里的優(yōu)設(shè)標(biāo)題就是在font.css文件里自定義的字體名
這樣就實(shí)現(xiàn)使用特殊字體啦,希望對(duì)萌新有所幫助~
補(bǔ)充知識(shí):怎么把分化成元,并且保留兩位小數(shù),用vue來(lái)做
我就廢話不多說(shuō)了,大家還是直接看代碼吧~
<el-table-column prop="amount" label="申請(qǐng)?zhí)岈F(xiàn)金額" width="120" align="center"> <template scope="scope"> {{ scope.row.amount | filterMoney }} </template> </el-table-column>
filters: { filterMoney (num) { return (num / 100).toFixed(2) } },
以上這篇vue如何使用外部特殊字體的操作就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
如何用vue-pdf包實(shí)現(xiàn)pdf文件預(yù)覽,支持分頁(yè)
這篇文章主要介紹了如何用vue-pdf包實(shí)現(xiàn)pdf文件預(yù)覽,支持分頁(yè)問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03elementui之el-table如何通過(guò)v-if控制按鈕顯示與隱藏
這篇文章主要介紹了elementui之el-table如何通過(guò)v-if控制按鈕顯示與隱藏問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-11-11Vue2與Vue3如何利用install自定義全局確認(rèn)框組件編寫
這篇文章主要介紹了Vue2與Vue3如何利用install自定義全局確認(rèn)框組件編寫方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03uniapp開發(fā)打包多端應(yīng)用完整方法指南
這篇文章主要介紹了uniapp開發(fā)打包多端應(yīng)用完整流程指南,包括了uniapp打包小程序,uniapp打包安卓apk,uniapp打包IOS應(yīng)用,需要的朋友可以參考下2022-12-12vue使用drag與drop實(shí)現(xiàn)拖拽的示例代碼
本篇文章主要介紹了vue使用drag與drop實(shí)現(xiàn)拖拽的示例代碼,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09解決Vue中 父子傳值 數(shù)據(jù)丟失問(wèn)題
這篇文章主要介紹了解決Vue中 父子傳值 數(shù)據(jù)丟失問(wèn)題,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-08-08