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 相关文章推荐
JavaScript创建命名空间(namespace)的最简实现
Dec 11 Javascript
Jquery中对数组的操作代码
Aug 12 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 Javascript
Jquery 点击按钮自动高亮实现原理及代码
Apr 25 Javascript
JS按回车键实现登录的方法
Aug 25 Javascript
vue多级多选菜单组件开发
Sep 08 Javascript
gulp解决跨域的配置文件问题
Jun 08 Javascript
使用vue如何构建一个自动建站项目
Feb 05 Javascript
javascript变量提升和闭包理解
Mar 12 Javascript
详释JavaScript执行环境与执行栈
Apr 02 Javascript
微信小程序用户授权,以及判断登录是否过期的方法
May 10 Javascript
JavaScript实现世界各地时间显示
Sep 07 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
php中日期加减法运算实现代码
2011/12/08 PHP
php自动获取关键字的方法
2015/01/06 PHP
php对接java现实加签验签的实例
2016/11/25 PHP
Thinkphp开发--集成极光推送
2017/09/15 PHP
PHP高并发和大流量解决方案整理
2019/12/24 PHP
地址栏上的一段语句,改变页面的风格。(教程)
2008/04/02 Javascript
jQuery 打造动态渐变按钮 详细图文教程
2010/04/25 Javascript
分享8款优秀的 jQuery 加载动画和进度条插件
2012/10/24 Javascript
JQuery制作的放大效果的popup对话框(未添加任何jquery plugin)分享
2013/04/28 Javascript
两个多选select(multiple左右)添加、删除选项和取值实例
2014/05/12 Javascript
JavaScript数组去重的3种方法和代码实例
2015/07/01 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
2015/10/13 Javascript
AngularJS基础 ng-mouseenter 指令示例代码
2016/08/02 Javascript
AngularJS中$injector、$rootScope和$scope的概念和关联关系深入分析
2017/01/19 Javascript
JavaScript插入排序算法原理与实现方法示例
2018/08/06 Javascript
jQuery 点击获取验证码按钮及倒计时功能
2018/09/20 jQuery
JS监听事件的叠加和移除功能
2018/11/19 Javascript
使用js在layui中实现上传图片压缩
2019/06/18 Javascript
动态创建类实例代码
2009/10/07 Python
python实现中文转换url编码的方法
2016/06/14 Python
python 专题九 Mysql数据库编程基础知识
2017/03/16 Python
python logging重复记录日志问题的解决方法
2018/07/12 Python
python如何将两张图片生成为全景图片
2020/03/05 Python
pyqt5 QlistView列表显示的实现示例
2020/03/24 Python
基于pycharm 项目和项目文件命名规则的介绍
2021/01/15 Python
您的健身减肥和健康饮食专家:vitafy
2017/06/06 全球购物
英国知名美妆护肤在线商城:Zest Beauty
2018/04/24 全球购物
土木工程个人自荐信范文
2013/11/30 职场文书
法学专业求职信
2014/07/15 职场文书
2015年银行员工工作总结
2015/04/24 职场文书
烛光里的微笑观后感
2015/06/17 职场文书
2015年迎新晚会策划书
2015/07/16 职场文书
中秋节随笔
2015/08/15 职场文书
详细聊聊MySQL中慢SQL优化的方向
2021/08/30 MySQL
AJAX引擎原理以及XmlHttpRequest对象的axios、fetch区别详解
2022/04/09 Javascript
MySQL中TIMESTAMP类型返回日期时间数据中带有T的解决
2022/12/24 MySQL