vue2 引入字体文件

1.以 YouSheBiaoTiHei 字体为例
 
2.下载字体地址：http://www.downcc.com/font/518114.html
更改名称:优设标题.ttf     ---->   YousheBiaoTiHei.ttf
 
3.字体文件下载成功，后放到项目文件中
 
例如:
1.将下载ttf放在src/assets/css/YousheBiaoTiHei.ttf
2.在同级中建立css文件,src/assets/css/YousheBiaoTiHei.css
 
 
4.在css中编写
 @font-face {
    /*给字体命名*/
    font-family: 'YouSheBiaoTiHei';
    /*引入字体文件*/
    src: url('./YouSheBiaoTiHei.ttf');
    font-weight: normal;
    font-style: normal;
 }
 
5.在main.js中引入
import '../src/assets/css/YouSheBiaoTiHei.css';
 
6.在自己页面中用
.family{
 
  font-family: YouSheBiaoTiHei;
 
}