vue项目引入外部字体
1、UI设计图有"华文黑体",担心客户端没有该字体,将"huawen.ttf"字体文件,放入项目中:

2、创建一个font.scss(或font.css)文件:
@font-face {
font-family: 'huawen'; //重命名字体名
src: url('huawen.ttf'); //引入字体
font-weight: normal;
font-style: normal;
}
3、在main.js中引入
import '@/common/css/font.scss';
4、就可以直接使用了:
div {
font-family: 'huawen';
}
vue项目引入外部字体的更多相关文章
- vue 项目引入字体报错
vue 项目引入特殊字体,总是提示有问题 原因是,在webpack 里面的配置有问题 在项目文件里面引入字体的时候,应该写url-loader 而不能是url
- HTML引入外部字体
HTML5如何引入外部字体 背景 现在我需要 "Montserrat-ExtraLight ExtraLight"类型的字体,但是html的font-family中找不到这个类型的 ...
- vue项目引入自定义.css的样式文件
ES6的引入方式: .vue文件中 css文件引入 <template></template> <style scoped> @import "../as ...
- vue页面引入外部js文件遇到的问题
问题一:vue文件中引入外部js文件的方法 //在vue文件中 <script> import * as funApi from '../../../publicJavaScript/pu ...
- css引入外部字体使网站字体更美观
@font-face{font-family: myFont;src:url("../font/timesi.ttf");src:url("../font/timesbi ...
- vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题
异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...
- vue项目引入element
前提工作-安装并配置好以下环境: 1.安装node 2.安装git 1.初始化项目 vue init webpack vue-elementui npm run dev 2.安装element np ...
- 【vue】vue项目引入 Element-UI
根据vue项目的搭建教程,接下来记录下如何在Vue-cli创建的项目中引入Element-UI. 1.安装直接用命令 (推荐) npm install element-ui 2.直接在根目录下的pac ...
- vue项目引入bootstrap正确姿势
vue如何引入bootstrap 最近在玩全栈,自然少不了vue的使用.使用vue-cli生成的项目想引入bootstrap,需要先安装相应的npm包,然后在代码中显示引入. 1.安装依赖包: cnp ...
随机推荐
- Zookeeper简介及安装(一)
1 Zookeeper入门1.1 概述Zookeeper是一个开源的分布式的,为分布式应用提供协调服务的Apache项目. 1.2 特点 1.3 数据结构 1.4 应用场景提供的服务包括:统一命名服务 ...
- (71)一篇文章带你熟悉HTTP协议
作者:涤生_Woo链接:http://www.jianshu.com/p/6e9e4156ece3來源:简书著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 本篇文章篇幅比较长,先 ...
- java把含小数点的数字字符串转换为int类型
String num ="1.00"; int abc =Double.valueOf(num).intValue();//转换为Int类型
- Spring Cloud Stream教程(五)编程模型
本节介绍Spring Cloud Stream的编程模型.Spring Cloud Stream提供了许多预定义的注释,用于声明绑定的输入和输出通道,以及如何收听频道. 声明和绑定频道 触发绑定@En ...
- SQL Server服务起不了
转载 MSSQLSERVER服务无法启动的解决方案 1.IP地址配置不正确: 打开 Microsoft SQL Server 2005配置工具下的SQL Server Configuration ...
- sqli-lab(13)
Double Injection- String- with twist(双注入 - 字符型 - 变形) 来进行我们的注入测试 直接闭合,用户名和密码输入“ ‘) or (‘1’) = (‘1%23 ...
- C#调用本地摄像头-AForge库简单使用
介绍 AForge百度词条: https://baike.baidu.com/item/AForge.NET/114415?fr=aladdin 用途 调用笔记本电脑自带的相机 示例 源码 using ...
- POST上传多张图片配合Django接受多张图片
POST上传多张图片配合Django接受多张图片 本地:POST发送文件,使用的是files参数,将本地的图片以二进制的方式发送给服务器. 在这里 files=[("img",op ...
- Oracle JET mobile cordove navigator.app对象
在使用 Oracle JET 开发 webapp 时,会使用到 ojrouter ,ojrouter 默认含有历史记录推送功能.在调试 Android 时会发现返回键总是返回到上一次浏览记录(App ...
- Python 2 和 3 的区别及兼容技巧
目录 目录 前言 Python 2 or 3 ? 不同与兼容 统一不等于语法 统一整数类型 统一整数除法 统一缩进语法 统一类定义 统一字符编码类型 统一导入模块的路径搜索方式 修正列表推导式的变量作 ...