如何在Vue项目中使用自定义字体
- 首先要得到自定义字体包（后缀名为.ttf, .otf, .eot等格式的字体包），可自行下载也可以问UI小姐姐要字体包，拿到字体包后进入项目中在assets文件夹下建一个fonts文件夹
- 把拿到的字体包放到fonts文件夹中接着创建一个fonts.css文件
- 在fonts.css文件中定义你所用的字体（这里以PingFang为例）
@font-face: {
font-family: 'PingFang-RE';
/* 重命名字体名 */
src: url('./PingFang\ Regular.ttf');
font-weight: normal;
font-style: normal;
}
- 在app.vue中引入fonts.css
@import './assets/fonts/fonts.css';
#app {
font-family: 'PingFang-RE';
font-weight: 400;
}推荐阅读
- 任时光绽放成六月繁花
- 我从来不做坏事
- 考研英语阅读终极解决方案——阅读理解如何巧拿高分
- 樱花雨
- 如何寻找情感问答App的分析切入点
- vue-cli|vue-cli 3.x vue.config.js 配置
- 拍照一年啦，如果你想了解我，那就请先看看这篇文章
- 2020-04-07vue中Axios的封装和API接口的管理
- mybatisplus如何在xml的连表查询中使用queryWrapper
- MybatisPlus使用queryWrapper如何实现复杂查询