前言： 做大屏 项目需要引入字体做个记录
一、先看看效果 

二、实现
1、下载字体文件

分享一个下载开源字体网站： https://www.dafont.com/theme.php
2、文件放到项目中

可以在src下的assets目录下新建一个font的目录（放在其他目录下一样可以），然后把下载的字体文件放入其中

3、创建css文件， 引入添加font-family

在font目录下创建一个css文件，自己随便取个名字，我用得是font.css:

 4、vue中全局引入字体

在main.js中引入刚才创建的css文件：

 5、在页面中使用字体

这就搞定了

vue中引入字体的更多相关文章

  1. vue中引入字体图标报错，找不到字体文件

    在用vue + webpack进行开发的时候,在引用字体图标遇到字体无法加载的问题: 报以下错误 搞了好久没搞定,最后才找到解决方法(还是没有找到原因) 修改字体图标的css中引入字体文件的路径 以前 ...

  2. vue中引入字体文件

    在用vue来写一官网的时候,想引入外部字体文件,毕竟总感觉他自己的字体有点难看,在这里记录下 1.先下载字体文件所需的.ttf文件 我这里想引入的是华文行楷字体 百度后下载了一个3M多的ttf文件 2 ...

  3. vue中引入babel步骤

    vue中引入babel步骤 vue项目中普遍使用es6语法,但有时我们的项目需要兼容低版本浏览器,这时就需要引入babel插件,将es6转成es5. 1.安装babel-polyfill插件 npm ...

  4. vue中引入json数据，不用本地请求

    1.我的项目结构,需要在Daily.vue中引入daily.js中的json数据 2.把json数据放入一个js文件中,用exports导出,vscode的json格式太严格了,很多数据,调了一个多小 ...

  5. vue中引入mintui、vux重构简单的APP项目

    最近在学习vue时也了解到一些常用的UI组件,有用于PC的和用于移动端的.用于PC的有:Element(饿了么).iView等:用于移动端APP的有Vux.Mint UI(饿了么).Vant(有赞团队 ...

  6. vue中引入mui报Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them的错误

    在vue中引入mui的js文件的时候,报如下的错误: 那是因为我们在用webpack打包项目时默认的是严格模式,我们把严格模式去掉就ok了 第一步:npm install babel-plugin-t ...

  7. vue中引入swiper(vue中的滑块组件vue-awesome-swiper)

    第一步安装 npm install vue-awesome-swiper --save 第二部在main.js中引入 import VueAwesomeSwiper from 'vue-awesome ...

  8. Vue中引入bootstrap导致的CSS问题

    最近在进行vue.js+webpack进行模块化开发的时候,遇到一个奇怪的问题. 问题是这样的: 1. 在main.js文件中引入bootstrap的js和css. 2. 自己写了一个Header.v ...

  9. vue中引入js，然后new js里的方法

    阿里云Web播放器Web端使用SDK说明:https://help.aliyun.com/document_detail/51991.html?spm=5176.11065259.1996646101 ...

  10. vue中引入css文件

    两种方式引入css文件,一种是直接在main.js中引入(也可以在其他的.vue文件中的<script></script>标签中),即下面这种写法: import 'eleme ...

随机推荐

  1. MySQL转义字符+存储过程的使用

    MySQL中大于,大于等于,小于,小于等于的转义写法 一.左边就是原来的符号,右边就是在mybatis中代替的符号 二.如何通过mysql的存储过程创建虚拟表(临时表),并插入1000条数据 这些表通 ...

  2. STM32按键控制LED亮灭的代码

    led.c #include "led.h" void LED_Config(void) { GPIO_InitTypeDef GPIO_InitStruct; RCC_APB2P ...

  3. Django静态文件配置、form表单、request对象、连接数据库、ORM

    目录 静态文件配置 静态文件相关配置 1.接口前缀 浏览器停用缓存 2.接口前缀动态匹配 form表单 action 控制数据提交的地址 method 控制数据提交的方法 请求方法补充 get: 朝服 ...

  4. TypeError: __str__ returned non-string (type WebStepInfo)

    错误代码: class CaseStep(models.Model): id = models.AutoField(primary_key=True) casetep = models.Foreign ...

  5. Linu基础 文件IO（读写操作）

    前言 本章讨论普通文件的读写.读写效率.简单介绍文件描述符.IO效率.文件共享和原子操作.dup.文件映射.临时文件. 文件描述符 在Linux系统中,打开的文件是用一个整数来表示的,表示打开文件的整 ...

  6. VsCode搭建C语言运行环境以及终端乱码问题解决

    在VsCode中搭建C/C++运行环境需要先安装以下插件 1.安装c/c++插件 2.安装code runner插件 当然也可以安装一些其他的美化插件根据个人习惯,但是以上这两个是必装的. 安装好插件 ...

  7. 5、Idea同时选择多处光标进行编辑

    1.按住Alt+Shift,然后用鼠标左键点击文本,可以让光标在多个位置出现2.每个光标都会同时输入你正在输入的文本3.ESC退出 搜索 复制

  8. day09-功能实现08

    家居网购项目实现08 以下皆为部分代码,详见 https://github.com/liyuelian/furniture_mall.git 19.功能18-添加家居到购物车 19.1需求分析/图解 ...

  9. 【架构设计】你真的理解软件设计中的SOLID原则吗？

    前言 在软件架构设计领域,有一个大名鼎鼎的设计原则--SOLID原则,它是由由Robert C. Martin(也称为 Uncle Bob)提出的,指导我们写出可维护.可以测试.高扩展.高内聚.低耦合 ...

  10. Gvim基础操作-01

    Gvim基础操作 进行代码或者是文本.脚本都要使用到文本编辑工具. vi是visual的缩写,其意为可视化.它是Unix系统文本编辑的标准工具.利用光标在屏幕上的移动,用户可以方便的建立.修改或者插入 ...