Vue项目 css下载字体并引入使用

1.下载字体
        下载字体：字体下载,字体大全,免费字体下载,在线字体|字客网字客网是全球知名的字体下载与分享网站,齐全的中文,日文,韩文,英文,图标,美术设计,毛笔,钢笔,手写,书法字体大全,提供找字体,字体识别,字体下载,在线字体预览,字体转换,字体设计等服务。https://www.fontke.com/
        下载之后复制里边的.ttf 文件

 

 

2.在assets添加一个文件夹text，自定义font.css 和font.ttf文件

3.下载之后复制里边的.ttf 文件更改名字直接替换font.ttf文件

@font-face {

  font-family: 'CKTJGZT';  

  src: url('font.ttf');

  font-weight: normal;

  font-style: normal;

}

4.入口文件main.ts 文件全局引入 

 import "./assets/text/font.css";

 5、页面中使用 //和css文件中的CKTJGZT保持一致

 font-family: 'CKTJGZT';