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 相关文章推荐
JQery jstree 大数据量问题解决方法
Mar 09 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
Jul 08 Javascript
关于js中alert弹出窗口文本换行问题简单详细说明
Dec 11 Javascript
用客户端js实现带省略号的分页
Apr 27 Javascript
iframe的onreadystatechange事件在firefox下的使用
Apr 16 Javascript
indexedDB bootstrap angularjs之 MVC DOMO (应用示例)
Jun 20 Javascript
全面了解js中的script标签
Jul 04 Javascript
bootstrap weebox 支持ajax的模态弹出框
Feb 23 Javascript
jQuery实现可编辑表格并生成json结果(实例代码)
Jul 19 jQuery
Vue组件模板形式实现对象数组数据循环为树形结构(实例代码)
Jul 31 Javascript
layui自定义插件citySelect实现省市区三级联动选择
Jul 26 Javascript
vue实现鼠标移过出现下拉二级菜单功能
Dec 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
PHP迭代器实现斐波纳契数列的函数
2013/11/12 PHP
ThinkPHP实现将本地文件打包成zip下载
2014/06/26 PHP
CI框架给视图添加动态数据
2014/12/01 PHP
PHP5.5安装PHPRedis扩展及连接测试方法
2017/01/22 PHP
php观察者模式应用场景实例详解
2017/02/03 PHP
解析 thinkphp 框架中的部分方法
2017/05/07 PHP
Firefox window.close()的使用注意事项
2009/04/11 Javascript
javascript arguments 传递给函数的隐含参数
2009/08/21 Javascript
Javascript异步编程的4种方法让你写出更出色的程序
2013/01/17 Javascript
基于jquery实现的定时显示与隐藏div广告的实现代码
2013/08/22 Javascript
js实现简单的验证码
2015/12/25 Javascript
浅析jQuery 遍历函数,javascript中的each遍历
2016/05/25 Javascript
JavaScript常用正则函数用法示例
2017/01/23 Javascript
js如何获取网页所有图片
2017/05/12 Javascript
React-Native做一个文本输入框组件的实现代码
2017/08/10 Javascript
EasyUI的DataGrid每行数据添加操作按钮的实现代码
2017/08/22 Javascript
浅谈vue中数据双向绑定的实现原理
2017/09/14 Javascript
关于NodeJS中的循环引用详解
2019/07/23 NodeJs
如何基于javascript实现贪吃蛇游戏
2020/02/09 Javascript
[01:29:31]VP VS VG Supermajor小组赛胜者组第二轮 BO3第一场 6.2
2018/06/03 DOTA
wxpython 学习笔记 第一天
2009/03/16 Python
Python模拟三级菜单效果
2017/09/11 Python
python numpy 一维数组转变为多维数组的实例
2018/07/02 Python
python十进制和二进制的转换方法(含浮点数)
2018/07/07 Python
利用Python的sympy包求解一元三次方程示例
2019/11/22 Python
django实现将后台model对象转换成json对象并传递给前端jquery
2020/03/16 Python
IWOOT美国:新奇的小玩意
2018/04/27 全球购物
什么是Assembly(程序集)
2014/09/14 面试题
校园奶茶店创业计划书
2014/01/23 职场文书
国际贸易专业个人职业生涯规划
2014/02/15 职场文书
大龄毕业生求职别忘职业规划
2014/03/11 职场文书
文化建设工作方案
2014/05/12 职场文书
年度安全生产目标责任书
2014/07/23 职场文书
读后感怎么写?书写读后感的基本技巧!
2019/12/10 职场文书
Django cookie和session的应用场景及如何使用
2021/04/29 Python
win11如何查看端口是否被占用? Win11查看端口是否占用的技巧
2022/04/05 数码科技