vue如何使用外部特殊字体的操作


Posted in Javascript onJuly 30, 2020

话不多说先看效果:

vue如何使用外部特殊字体的操作

我这里使用的是“优设标题这种字体”,接下来就是实现步骤了:

1、先在百度上下载所需要的字体ttf文件

vue如何使用外部特殊字体的操作

2、在src文件夹新建common文件夹再建 font文件夹

vue如何使用外部特殊字体的操作

3、在font文件夹里新建 font.css文件,以及把下载好的ttf文件放入

font.css内容如下

vue如何使用外部特殊字体的操作

4、在App.vue的style里引入font.css文件

vue如何使用外部特殊字体的操作

5、在需要用到特殊字体的地方,把 font-family:”自定义字体名”,这里的优设标题就是在font.css文件里自定义的字体名

vue如何使用外部特殊字体的操作

这样就实现使用特殊字体啦,希望对萌新有所帮助~

补充知识:怎么把分化成元,并且保留两位小数,用vue来做

我就废话不多说了,大家还是直接看代码吧~

<el-table-column prop="amount"
            label="申请提现金额"
            width="120" 
            align="center">
    <template scope="scope">
     {{ scope.row.amount | filterMoney }}
    </template>
   </el-table-column>
filters: {
  filterMoney (num) {
   return (num / 100).toFixed(2)
  }
 },

以上这篇vue如何使用外部特殊字体的操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网页里控制图片大小的相关代码
Jun 25 Javascript
javascript学习笔记(七)利用javascript来创建和存储cookie
Apr 08 Javascript
写得不错的jquery table鼠标经过变色代码
Sep 27 Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
Dec 16 Javascript
jQuery实现的简单百分比进度条效果示例
Aug 01 Javascript
javascript设计模式之模块模式学习笔记
Feb 15 Javascript
JavaScript实现反转字符串的方法详解
Apr 27 Javascript
聊聊JS动画库 Velocity.js的使用
Mar 13 Javascript
vue解决弹出蒙层滑动穿透问题的方法
Sep 22 Javascript
vue-music 使用better-scroll遇到轮播图不能自动轮播问题
Dec 03 Javascript
Vue中fragment.js使用方法小结
Feb 17 Javascript
使用js原生实现年份轮播选择效果实例
Jan 12 Javascript
在vue-cli3中使用axios获取本地json操作
Jul 30 #Javascript
JavaScript JSON使用原理及注意事项
Jul 30 #Javascript
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 #Javascript
基于JavaScript实现猜数字游戏代码实例
Jul 30 #Javascript
如何用JS模拟实现数组的map方法
Jul 30 #Javascript
Vue性能优化的方法
Jul 30 #Javascript
vue props default Array或是Object的正确写法说明
Jul 30 #Javascript
You might like
写一个用户在线显示的程序
2006/10/09 PHP
PHP CURL post数据报错 failed creating formpost data
2016/10/16 PHP
PHP获取HTTP body内容的方法
2018/12/31 PHP
js获取checkbox复选框选中的选项实例
2014/08/24 Javascript
Javascript添加监听与删除监听用法详解
2014/12/19 Javascript
Angular.js与Bootstrap相结合实现手风琴菜单代码
2016/04/13 Javascript
基于javascript数组实现图片轮播
2016/05/02 Javascript
详解jquery easyui之datagrid使用参考
2016/12/05 Javascript
深入理解Node中的buffer模块
2017/06/03 Javascript
JS实现上传图片的三种方法并实现预览图片功能
2017/07/14 Javascript
使用iView Upload 组件实现手动上传图片的示例代码
2018/10/01 Javascript
node实现分片下载的示例代码
2018/10/17 Javascript
微信小程序实现九宫格抽奖
2020/04/15 Javascript
Vue Echarts实现可视化世界地图代码实例
2019/05/07 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
2020/10/30 Javascript
轻松实现python搭建微信公众平台
2016/02/16 Python
5分钟 Pipenv 上手指南
2018/12/20 Python
解决nohup执行python程序log文件写入不及时的问题
2019/01/14 Python
把vgg-face.mat权重迁移到pytorch模型示例
2019/12/27 Python
Python实现括号匹配方法详解
2020/02/10 Python
自学python用什么系统好
2020/06/23 Python
Python利用myqr库创建自己的二维码
2020/11/24 Python
地球上最先进的胡子和头发修剪器:Bevel
2018/01/23 全球购物
亚洲独特体验旅游专家:eOasia
2018/08/15 全球购物
高中毕业生生活的自我评价
2013/12/08 职场文书
银行职员个人的工作自我评价
2014/02/15 职场文书
人事科岗位职责范本
2014/03/02 职场文书
2014年五四青年节活动策划书
2014/04/22 职场文书
2014年教师党员公开承诺书
2014/05/28 职场文书
车辆工程专业求职信
2014/06/14 职场文书
公司董事长助理工作职责
2014/07/12 职场文书
爱与责任师德演讲稿
2014/08/26 职场文书
机关作风建设工作总结
2014/10/23 职场文书
招商银行收入证明
2015/06/17 职场文书
nginx proxy_cache 缓存配置详解
2021/03/31 Servers
Win11怎么启动任务管理器?Win11启动任务管理器的几种方法
2021/11/23 数码科技