vue项目引入外部字体
1、UI设计图有"华文黑体",担心客户端没有该字体,将"huawen.ttf"字体文件,放入项目中:

2、创建一个font.scss(或font.css)文件:
@font-face {
font-family: 'huawen'; //重命名字体名
src: url('huawen.ttf'); //引入字体
font-weight: normal;
font-style: normal;
}
3、在main.js中引入
import '@/common/css/font.scss';
4、就可以直接使用了:
div {
font-family: 'huawen';
}
vue项目引入外部字体的更多相关文章
- vue 项目引入字体报错
vue 项目引入特殊字体,总是提示有问题 原因是,在webpack 里面的配置有问题 在项目文件里面引入字体的时候,应该写url-loader 而不能是url
- HTML引入外部字体
HTML5如何引入外部字体 背景 现在我需要 "Montserrat-ExtraLight ExtraLight"类型的字体,但是html的font-family中找不到这个类型的 ...
- vue项目引入自定义.css的样式文件
ES6的引入方式: .vue文件中 css文件引入 <template></template> <style scoped> @import "../as ...
- vue页面引入外部js文件遇到的问题
问题一:vue文件中引入外部js文件的方法 //在vue文件中 <script> import * as funApi from '../../../publicJavaScript/pu ...
- css引入外部字体使网站字体更美观
@font-face{font-family: myFont;src:url("../font/timesi.ttf");src:url("../font/timesbi ...
- vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题
异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...
- vue项目引入element
前提工作-安装并配置好以下环境: 1.安装node 2.安装git 1.初始化项目 vue init webpack vue-elementui npm run dev 2.安装element np ...
- 【vue】vue项目引入 Element-UI
根据vue项目的搭建教程,接下来记录下如何在Vue-cli创建的项目中引入Element-UI. 1.安装直接用命令 (推荐) npm install element-ui 2.直接在根目录下的pac ...
- vue项目引入bootstrap正确姿势
vue如何引入bootstrap 最近在玩全栈,自然少不了vue的使用.使用vue-cli生成的项目想引入bootstrap,需要先安装相应的npm包,然后在代码中显示引入. 1.安装依赖包: cnp ...
随机推荐
- 利用word宏功能一键导出数据库表结构
前言: 需求是: 为了完成<数据库设计文档>中的表结构展示,需要导出所有的表结构,包括字段名.长度.注释等必要标题. 数据库:MySQL 我选择的方法是——用word的宏功能导出.很多博客 ...
- (58)PHP开发
LAMP 0.使用include和require命令来包含外部PHP文件. 使用include_once命令,但是include和include_once命令相比的不足就是这两个命令并不关心请求的文件 ...
- WinRAR 常用变量列表
%SystemDrive%操作系统所在的分区号.如 C:%SystemRoot%操作系统根目录.如 C:\WINDOWS%windir%操作系统根目录.如 C:\WINDOWS%ALLUSERSP ...
- ELK5+redhat7.4配置elasticsearch集群
ELK介绍 ELK是三个开源软件的缩写,即elasticsearch.logstack.kibana. Elasticsearch:开源分布式搜索引擎,提供搜集.分析.存储数据三大功能.它的特点有:分 ...
- python正则之模式re.I re.M
re.I 忽略大小写 >>> re.match(r"A","abc",re.I) <_sre.SRE_Match object at 0 ...
- 图的普里姆(Prim)算法求最小生成树
关于图的最小生成树算法------普里姆算法 首先我们先初始化一张图: 设置两个数据结构来分别代表我们需要存储的数据: lowcost[i]:表示以i为终点的边的最小权值,当lowcost[i]=0说 ...
- 2018-2019-2 20165235《网络对抗技术》Exp7 网络欺诈防范
2018-2019-2 20165235<网络对抗技术>Exp7 网络欺诈防范 实验目的 本实践的目标理解常用网络欺诈背后的原理,以提高防范意识,并提出具体防范方法 实验内容 (1)简单应 ...
- Oracle dba角色和sysdba的区别
如果用户需要远程sysdba的方式登陆,需要grant sysdba权限,登陆后以sys用户执行命令,需要验证密码文件. 密码文件如果是从12c之前的老版本同步过来,需要重建12c格式的密码文件. d ...
- zabbix 监控安装部署
今天尝试一下部署zabbix 官方文档包括多个版本,此处选择4.0版本 https://www.zabbix.com/documentation/4.0/manual 1.安装环境选择 zabbix4 ...
- 吃着火锅唱着歌学会Docker
第一篇:Docker概述 第二篇:Docker之版本与安装 第三篇:Docker之镜像 第四篇:Docker之容器 第五篇:Dcoker之容器与镜像 第六篇:Docker之网络管理 第七篇:Docke ...