美文网首页
在vue项目中添加特殊字体

在vue项目中添加特殊字体

作者: alokka | 来源:发表于2020-03-18 18:31 被阅读0次

我们做项目的时候,有时候会想用一些特殊字体来美化我们的页面,下面就教大家如何在vue中引用其他字体

  1. 首先要去百度搜索我们想要的字体或者在字体网站找一个我们觉得合适的字体
    这里推荐下面的网站 第一字体转换器 其他网站也都可以

    在这里插入图片描述
  2. 下载我们需要的.ttf文件 放在我们本地文件夹中


    在这里插入图片描述
  3. 在文件夹下 创建一个 font.css 文件 通过 @font-face 规则引入我们的文件和给字体命名


    在这里插入图片描述
  4. 在 vue 中的 main.js 引入我们的 font.css


    在这里插入图片描述
  5. 然后就可以在任意组件的 css 中使用啦


    在这里插入图片描述

相关文章

网友评论

      本文标题:在vue项目中添加特殊字体

      本文链接:https://www.haomeiwen.com/subject/mnmcyhtx.html