vue项目引入字体.ttf的方法


Posted in Javascript onSeptember 28, 2018

1、下载所需要的字体,.ttf格式本文以(FZCYJ.ttf 为例)

2、在src下新建common文件,文件夹中包含以下文件

vue项目引入字体.ttf的方法

3、打开font.css

@font-face { 
 font-family: 'FZCYJ'; //重命名字体名
 src: url('FZCYJ.ttf'); //引入字体
 font-weight: normal; 
 font-style: normal; 
}

4、配置webpack.base.conf.js 文件

vue项目引入字体.ttf的方法

5、App.vue引入字体

vue项目引入字体.ttf的方法

6、可在body中设置字体

body{
 font-family: FZCYJ;
}

以上这篇vue项目引入字体.ttf的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery学习笔记之回调函数
Aug 15 Javascript
js实现添加可信站点、修改activex安全设置,禁用弹出窗口阻止程序
Aug 17 Javascript
AngularJS模板加载用法详解
Nov 04 Javascript
详解数组Array.sort()排序的方法
May 09 Javascript
Angular搜索场景中使用rxjs的操作符处理思路
May 30 Javascript
JS实现把一个页面层数据传递到另一个页面的两种方式
Aug 13 Javascript
layui弹出层按钮提交iframe表单的方法
Aug 20 Javascript
浅谈vue 锚点指令v-anchor的使用
Nov 13 Javascript
JavaScript实现像雪花一样的Hexaflake分形
Jul 07 Javascript
js实现简单的无缝轮播效果
Sep 05 Javascript
vue通过接口直接下载java生成好的Excel表格案例
Oct 26 Javascript
Vue2.0 ES6语法降级ES5的操作
Oct 30 Javascript
vue打包相关细节整理(小结)
Sep 28 #Javascript
在vue-cli的组件模板里使用font-awesome的两种方法
Sep 28 #Javascript
Vue 第三方字体图标引入 Font Awesome的方法
Sep 28 #Javascript
浅谈VUE-CLI脚手架热更新太慢的原因和解决方法
Sep 28 #Javascript
用npm安装vue和vue-cli,并使用webpack创建项目的方法
Sep 28 #Javascript
详解适配器在JavaScript中的体现
Sep 28 #Javascript
在微信小程序中渲染HTML内容的方法示例
Sep 28 #Javascript
You might like
用PHP和ACCESS写聊天室(六)
2006/10/09 PHP
解析在PHP中使用mysqli扩展库对mysql的操作
2013/07/03 PHP
php微信公众开发之获取周边酒店信息的方法
2014/12/22 PHP
PHP jpgraph库的配置及生成统计图表:折线图、柱状图、饼状图
2017/05/15 PHP
php变量与JS变量实现不通过跳转直接交互的方法
2017/08/25 PHP
PHP的PDO错误与错误处理
2019/01/27 PHP
JS获取IUSR_机器名和IWAM_机器名帐号的密码
2006/12/06 Javascript
jQuery在vs2008及js文件中的无智能提示的解决方法
2010/12/30 Javascript
理解JavaScript中的对象 推荐
2011/01/09 Javascript
根据邮箱的域名跳转到相应的登录页面的代码
2012/02/27 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
2013/07/10 Javascript
javascript实现全角与半角字符的转换
2015/01/07 Javascript
JavaScript中的标签语句用法分析
2015/02/10 Javascript
JavaScript原生对象之String对象的属性和方法详解
2015/03/13 Javascript
同步异步动态引入js文件的几种方法总结
2016/09/23 Javascript
基于JavaScript实现焦点图轮播效果
2017/03/27 Javascript
Vue2.0 实现单选互斥的方法
2018/04/13 Javascript
Quasar Input:type="number" 去掉上下小箭头 实现加减按钮样式功能
2020/04/09 Javascript
Vue前端判断数据对象是否为空的实例
2020/09/02 Javascript
Python动态加载模块的3种方法
2014/11/22 Python
TensorFlow模型保存和提取的方法
2018/03/08 Python
python通过Windows下远程控制Linux系统
2018/06/20 Python
python3读取csv和xlsx文件的实例
2018/06/22 Python
解决python tkinter界面卡死的问题
2019/07/17 Python
Python 异常处理Ⅳ过程图解
2019/10/18 Python
深度学习入门之Pytorch 数据增强的实现
2020/02/26 Python
Exoticca英国:以最优惠的价格提供豪华异国情调旅行
2018/10/18 全球购物
一套.net面试题及答案
2016/11/02 面试题
企业环保标语
2014/06/10 职场文书
合作协议书范文
2014/08/20 职场文书
校庆团日活动总结
2014/08/28 职场文书
关于晚自习早退的检讨书
2014/09/13 职场文书
先进基层党组织材料
2014/12/25 职场文书
在酒桌上的敬酒词
2015/08/12 职场文书
心得体会该怎么写呢?
2019/06/27 职场文书
分析MySQL优化 index merge 后引起的死锁
2022/04/19 MySQL