vue项目引入外部字体
1.src下创建文件夹common,在common文件下创建一个文件夹font-face和一个font-face.css
2.在文件夹font-face放入下载好的字体
3.font-face.css中引入字体并且重命名
@font-face {
/* 重命名字体 */
font-family: 'SourceHanSans-Bold';
/* 引入字体 */
src: url('./font-face/SourceHanSans-Bold.otf');
}
@font-face {
/* 重命名字体 */
font-family: 'SourceHanSans-Heavy';
/* 引入字体 */
src: url('./font-face/SourceHanSans-Heavy.otf');
}
4.在main.js中全局引入
import '@/common/font.css';
5.即可在项目中使用字体