vue项目如何设置全局字体样式font-family

vue项目设置全局字体样式font-family

直接在app.vue文件中加上一下代码即可，这是我收集的比较全的字体样式，从第一个向后找，系统有就默认显示第一个，

依次往后找：

<style lang="scss">
body {
  font-family:”Microsoft YaHei”,Arial,Helvetica,sans-serif,”宋体”;
}
</style>

你学废了吗！

vue中替换全局字体

产品说项目要拿去展会展示，但现在项目字体是微软雅黑，不支持商用，需要全局替换思源字体。

下载字体

推荐一个网站，字体天下，好用

下载好的文件如下：

引入字体

1、在项目资源目录下新建一个fonts文件夹，引入下载好的字体文件

2、编写css文件（我的是font.less）

@font-face{
  font-family: HanSans;
  src: url('../fonts/SourceHanSansCN-VF-2.otf')
}

3、main.js引入思源字体

import '@/assets/css/font.less' // 引入思源字体

使用

1、在App.vue中

2、搜索font-family，看有没有被替换掉的字体，改过来

完事！

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。