在Vue项目中引入字体.ttf的方法
5星
- 浏览量: 0
- 大小:None
- 文件类型：None
简介：
本文介绍了如何在基于Vue框架的Web开发项目中成功集成和使用本地存储的.ttf字体文件，提供详细步骤与代码示例。
1. 下载所需的字体文件（例如FZCYJ.ttf）。
2. 在src目录下新建一个common文件夹，并在其中放置相关文件。
3. 打开font.css，添加以下代码：
```
@font-face {
font-family: FZCYJ; /* 设置字体名称 */
src: url(FZCYJ.ttf); /* 引入字体路径 */
font-weight: normal;
font-style: normal;
}
```
4. 修改webpack.base.conf.js文件，进行必要的配置。
5. 在App.vue中引入新字体。
6. 可以在body标签中设置全局的字体样式：
```css
body {
font-family: FZCYJ; /* 使用自定义字体 */
}
全部评论 (0)
还没有任何评论哟~
