vue如何使用外部特殊字體的操作
更新時(shí)間：2020年07月30日 10:49:58 作者：聽聽那晚風(fēng)
這篇文章主要介紹了vue如何使用外部特殊字體的操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
話不多說先看效果：
我這里使用的是“優(yōu)設(shè)標(biāo)題這種字體”，接下來就是實(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來做
我就廢話不多說了，大家還是直接看代碼吧~
<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)文章
Avue自定義formslot調(diào)用rules自定義規(guī)則方式
在Avue框架中,使用formslot自定義表格列時(shí)可能會(huì)遇到無法調(diào)用Avue的自定義校驗(yàn)規(guī)則的問題,這通常發(fā)生在嘗試通過formslot自定義設(shè)置列的場(chǎng)景中,解決這一問題的一個(gè)有效方法是將自定義列與Avue的校驗(yàn)規(guī)則通過特定方式連接起來2024-10-10
談?wù)刅UE種methods watch和compute的區(qū)別和聯(lián)系
本篇文章主要介紹了談?wù)刅UE種methods watch和compute的區(qū)別和聯(lián)系，具有一定的參考價(jià)值，有興趣的可以了解一下2017-08-08
Pinia 是2019年由vue.js官方成員重新設(shè)計(jì)的新一代狀態(tài)管理庫,類似Vuex,下面我們就來學(xué)習(xí)一下如何通過Pinia實(shí)現(xiàn)持久化存儲(chǔ)的相關(guān)知識(shí),感興趣的小伙伴可以了解下2023-12-12
Vite中自制mock服務(wù)器(不使用第三方服務(wù))
本文主要介紹了Vite中自制mock服務(wù)器，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-04-04
這篇文章主要給大家介紹了關(guān)于vue中適配px2rem的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
vue 解決移動(dòng)端彈出鍵盤導(dǎo)致頁面fixed布局錯(cuò)亂的問題
今天小編就為大家分享一篇vue 解決移動(dòng)端彈出鍵盤導(dǎo)致頁面fixed布局錯(cuò)亂的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-11-11
這篇文章主要介紹了Vue3不支持Filters過濾器的問題,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-09-09
Vue引用第三方datepicker插件無法監(jiān)聽datepicker輸入框的值的解決
這篇文章主要介紹了Vue引用第三方datepicker插件無法監(jiān)聽datepicker輸入框的值的解決，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-01-01
Vue3封裝ant-design-vue表格的詳細(xì)代碼
這篇文章主要介紹了Vue3封裝ant-design-vue表格，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-05-05
這篇文章主要介紹了vue3.0安裝Element?ui及矢量圖使用,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-12-12