成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

vue中引入字體文件

rose / 1411人閱讀

摘要:在用來寫一官網(wǎng)的時(shí)候,想引入外部字體文件,畢竟總感覺他自己的字體有點(diǎn)難看,在這里記錄下先下載字體文件所需的文件我這里想引入的是華文行楷字體百度后下載了一個(gè)多的文件將字體文件引入自己定義一個(gè)文件夾,放入下載好的文件先自己定義一個(gè)文件,將下載好

在用vue來寫一官網(wǎng)的時(shí)候,想引入外部字體文件,畢竟總感覺他自己的字體有點(diǎn)難看,在這里記錄下
1.先下載字體文件所需的.ttf文件

我這里想引入的是華文行楷字體

百度后下載了一個(gè)3M多的ttf文件

2.將字體文件引入

自己定義一個(gè)文件夾,放入下載好的.ttf文件

先自己定義一個(gè)font.css文件,將下載好的字體文件的路徑引入

@font-face {
  font-family: "華文行楷";
  src: url("stxingka.ttf");
  font-weight: normal;
  font-style: normal;
}

在App.vue中的style里引入

在webpack的配置文件里要加上解析.ttf文件的規(guī)則

module: {
    rules: [
        {
            test: /.(woff2?|eot|ttf|otf)(?.*)?$/,
            loader: "url-loader",
            options: {
                limit: 10000,
                name: utils.assetsPath("fonts/[name].[hash:7].[ext]")
            }
        }
    ]
}

使用的話,就按照原本的字體名稱,如我下的是華文行楷,就直接用華文行楷就可以了

正在努力學(xué)習(xí)中,若對你的學(xué)習(xí)有幫助,留下你的印記唄(點(diǎn)個(gè)贊咯^_^)

往期好文推薦:

判斷iOS和Android及PC端

純css實(shí)現(xiàn)瀑布流(multi-column多列及flex布局)

實(shí)現(xiàn)單行及多行文字超出后加省略號

微信小程序之購物車和父子組件傳值及calc的注意事項(xiàng)

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/100092.html

相關(guān)文章

  • 一個(gè)高仿追書神器的vue閱讀器。已成功做成app

    摘要:原創(chuàng),基本上是界面,新加了七八個(gè)功能,解決了前輩閱讀器上的絕大部分,并成功添加路徑打包成。畢竟只是一個(gè)學(xué)習(xí)項(xiàng)目跨域問題本次開發(fā)使用的是代理追書神器,是不需要后臺認(rèn)證直接可以跨域的接口,以實(shí)現(xiàn)在移動端顯示的效果。 應(yīng)屆畢業(yè)生,目前正在找工作,簡歷需要所以開發(fā)了這個(gè)app。剛開始開發(fā)也是一臉懵逼,因?yàn)闆]得后臺,一些邏輯功能也不知道怎么拓展。好在看到了追書神器api接口,頓時(shí)讓我決心做出這一...

    miracledan 評論0 收藏0
  • vue 項(xiàng)目總結(jié)一組件開發(fā)的配置和例子

    摘要:入口文件,影響全局,作用是引入全局使用的庫公共的樣式和方法設(shè)置路由等。項(xiàng)目里總會有一些復(fù)用的組件,例如彈出框發(fā)送手機(jī)驗(yàn)證碼圖片上傳等,將它們作為通用組件,避免重復(fù)工作結(jié)構(gòu)如下可以根據(jù)功能模塊建立文件夾,放置本功能會用到的通用組件。 上一篇文章 https://segmentfault.com/a/11... 介紹了項(xiàng)目里文件夾的分類和作用,這次主要說明 src 文件夾里具體的文件分類和...

    melody_lql 評論0 收藏0
  • vue 項(xiàng)目總結(jié)一組件開發(fā)的配置和例子

    摘要:入口文件,影響全局,作用是引入全局使用的庫公共的樣式和方法設(shè)置路由等。項(xiàng)目里總會有一些復(fù)用的組件,例如彈出框發(fā)送手機(jī)驗(yàn)證碼圖片上傳等,將它們作為通用組件,避免重復(fù)工作結(jié)構(gòu)如下可以根據(jù)功能模塊建立文件夾,放置本功能會用到的通用組件。 上一篇文章 https://segmentfault.com/a/11... 介紹了項(xiàng)目里文件夾的分類和作用,這次主要說明 src 文件夾里具體的文件分類和...

    isaced 評論0 收藏0
  • 使用vue完成微信公眾號網(wǎng)頁小記

    摘要:前言公司最近有一個(gè)頁面的功能,比較簡單的一個(gè)調(diào)查表功能,嵌套在我們微信公眾號里面。同時(shí)用到了微信的登錄和分享接口。參考鏈接使用微信接口前端部分我們用微信接口主要是做的登錄和分享功能,首先是上微信公眾平臺上邊看看,把權(quán)限搞好之后后端配置。 showImg(https://segmentfault.com/img/bVbrOkH); 前言: 公司最近有一個(gè)H5頁面的功能,比較簡單的一個(gè)調(diào)查...

    phoenixsky 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<