在vue项目中添加特殊字体
这里的特殊字体,指的是一般用户电脑未安装到本地的字体,要引入这样的字体,首先需要把字体文件下载下来。

就像上图这样的,ttf格式的,然后在项目里添加它。

然后我们在font.css里用@font-face规则引入这个字体文件并命名它。

然后在App.vue里的style导入它:

然后在任意组件中就可以使用了,效果如下:

在vue项目中添加特殊字体的更多相关文章
- 如何在VUE项目中添加ESLint
如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...
- vue项目中添加单元测试
从网上找了很多例子关于单元测试,都是如何新建项目的时候的添加单元测试,用vue-cli中怎么添加,但是我的项目已经生成了,不能再一次重新初始化,这时如何添加单元测试,这里面遇到了好多坑,写在这里记录一 ...
- Vue 项目中添加全局过滤器以及全局混合mixin
可以在.vue文件中定义局部使用的过滤器 export default{ data(){ return [] }, filters:{ toUpperCase:function(value){ ret ...
- vue项目中添加百度地图功能及解决遇到的问题详解
第一步,在百度地图开放平台 申请密钥 (如果有密钥可以省略此步骤,朋友有也可以借) 地址:http://lbsyun.baidu.com/ 第二步,创建应用并填写表单(下面链接可参考) http:// ...
- Vue项目里添加特殊字体或 某些字体乱码的问题
问题:有个西藏的项目因使用藏文,而出现乱码 (一开始不乱的,不知道后台怎么处理...后来不知道为啥,前端乱码了) 解决:字体ttf 格式已下载,在项目中全局引入了 @font-face { font- ...
- 在vue项目中添加一个html页面,开启本地服务器
在vue项目里新增一个不需要登录的页面,那么我只能新增一个html页面了,不经过路由,直接在浏览器输入路径打开,那么就需要用到本地服务器, 1.vue里面的html页面最好放过在public文件夹里面 ...
- vue 项目中添加阿里巴巴矢量图
1. 选择需要的图标,添加到购物车 2. 打开购物车,添加至我的项目 3. 打开项目列表 - 更多操作 - 编辑项目 修改FontClass/Symbol前缀,自定义一个名称,例如:v-icon-cu ...
- vue项目中使用特殊字体
项目开发中遇到要是有‘数字’字体的情况,样式如下 网上查了一下实现的方法很简单,而且具体的实现方式大致相同,可以参考以下几个链接: https://www.cnblogs.com/zhangnan35 ...
- 在vue项目中添加全局提示框
1.写一个提示框组件:msg.vue (注明:这里用两个div的原因是成功和失败的提示不能用同一个div,因为他们可能紧接着出现,所以不能从始至终只有一个提示框在工作) 2.写一个调用此组建的js : ...
随机推荐
- Maven捆绑TestNG实现测试自动化执行、部署和调度
一. 需求介绍 自动化测试,尤其是接口测试时,要写大量的测试用例,这些测试用例我们当然首选使用TesteNG编写,用例数量大,还涉及各种依赖包之类的问题,因此用Maven管理也是最方便最易实现的. 面 ...
- js事件的绑定与移除
事件的绑定分为3类: <div id='clickEvent'>点击事件</div> 在DOM元素中直接绑定 <div onclick="alert('4567 ...
- Qt5对XML文件操作
转自https://blog.csdn.net/hpu11/article/details/80227093 写入xml //写xml void WriteXml() { //打开或创建文件 QFil ...
- MyBatis-Plus 3.0.3 Sql注入器添加,即全局配置Sql注入器,sqlInjector改写
官网上写着 但是,这个其实是2.0系列的写法,由于引用了最新的3.0.3这个功能基本不好使. 3.0.3版本的写法 也就是中间加了一层,原来是AutoSqlInjector,现在改为AbstractS ...
- 关于字符的C++函数
toupper(), tolower()不会改变原来的字符; 如果输入不是字母, 返回值跟原字符相同. isupper(), islower()..
- Spring使用Autowiring自动装配 解决提示报错小技巧
1.打开Settings 输入Inspections 找到Spring --> Spring Core --> Code --> Autowiring for Bean ...
- vshost32-clr2.exe 已停止工作
软件中使用了DevComponents.DotNetBar2.dll MessageBoxEx.Show("ddd");运行到这句出现如上错误 解决:在项目属性里->调试: ...
- 小程序 mpvue自定义底部导航栏
1.在compontents新建文件放入 <template> <section class="tabBar-wrap"> <article clas ...
- 获取resource下文件
Resource resource = new ClassPathResource(certPath);File file= resource.getFile();
- centos 7 默认图形界面(或者字符界面)启动
1.切换到管理员用户 2.systemctl get-default命令获取当前模式(可以省去) 3.systemctl set-default graphical.target 修改启动模式(修改为 ...