第一步
设置下载字体
例如:下载 阿里妈妈
第二步
将下载的文件移入项目资源目录。
/assets/css
/* 文件名: /assets/css/font.css */
@font-face {
font-family: "Font Name";
src: url("/src/assets/css/AlimamaFangYuanTiVF-Thin.ttf");
}
引入文件一定检查路径和后缀,我写博客就是为了嘲讽自己,ttf,不是tff。😂
第三部
引入工程文件,VUE3 建议mian.ts
import "@/assets/css/font.css"
nuxt的没有main,全局引入需要在nuxt.config.ts文件中配置
//nuxt.config.ts
export default defineNuxtConfig({
css: ["../assets/css/main.css"],
})
第四部
在工程文件中使用
<p style="font-family: 'Font Name';"> 😂😂😂😂<p>