美文网首页
VUE中引入字体

VUE中引入字体

作者: 喜欢走弯路的人 | 来源:发表于2023-12-27 17:57 被阅读0次

1.搜索下载需要的字体: https://www.dafont.com/theme.php

2.在vue项目下的src/assets文件夹下创建font文件夹,放入需要用的字体并新建font.css 

3.font.css写入如下代码

@font-face {

    font-family:"MyFont"; //自定义字体名称

    src: url('./micross.ttf'); //引入字体路径

}

4.在main.js中根据路径引入创建的css文件

// 引入字体样式

import "@/assets/font/font.css"

5.在页面中使用字体

div{

       font-family:MyFont

}    

相关文章

  • vue中引入字体包

    1-在assets文件夹下新建font文件,将字体文件放入该文件夹下 2-新建myFont.css文件并在main...

  • vue中怎么引入字体包

    项目中遇到一些特殊的字体 需要引入我们需要提前下载好这个字体 一 创建文件夹 存放字体在src目录下创建text文...

  • vue 引入字体文件

    引入字体文件 1、将字体文件拷贝到assets/ttf文件夹下。2、在assets/css文件夹下新建font.c...

  • vue之引入字体

    1、下载所需要的字体,.ttf格式本文以(FZCYJ.ttf 为例) 2、在src下新建common文件,文件夹中...

  • VUE项目引入字体

    前言 在项目中,往往需要引入外部字体,使得页面更好看一些 一、引入外部字体 在src文件夹的assets文件夹下新...

  • vue项目引入字体

    下载想要引入的字体的字体包; 将要的字体放在asse目录下(目录不限,能引用到就行)并创建一个 css 文件;im...

  • uniapp开发随笔

    1.vue3中全局属性 例:注册全局请求方法 2.引入iconfont字体 直接引入在小程序中无效此处最终采用将i...

  • vue中引入iconfont字体图标报错

    在main中引入iconfont报错 import '@/assets/iconfont/iconfont.css...

  • vue学习笔记--Element引入

    完整引入:首先要在入口文件main中://引入vue import Vue from 'vue'; //引入 El...

  • elementUI字体图标不显示问题

    自己搭建的Vue项目,没有使用vue-cli,引入elementUI时提示字体图标404,找不到文件,如下错误: ...

网友评论

      本文标题:VUE中引入字体

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