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项目引入外部字体的更多相关文章

  1. vue 项目引入字体报错

    vue 项目引入特殊字体,总是提示有问题 原因是,在webpack 里面的配置有问题 在项目文件里面引入字体的时候,应该写url-loader 而不能是url

  2. HTML引入外部字体

    HTML5如何引入外部字体 背景 现在我需要 "Montserrat-ExtraLight ExtraLight"类型的字体,但是html的font-family中找不到这个类型的 ...

  3. vue项目引入自定义.css的样式文件

    ES6的引入方式: .vue文件中 css文件引入 <template></template> <style scoped> @import "../as ...

  4. vue页面引入外部js文件遇到的问题

    问题一:vue文件中引入外部js文件的方法 //在vue文件中 <script> import * as funApi from '../../../publicJavaScript/pu ...

  5. css引入外部字体使网站字体更美观

    @font-face{font-family: myFont;src:url("../font/timesi.ttf");src:url("../font/timesbi ...

  6. vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题

    异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...

  7. vue项目引入element

    前提工作-安装并配置好以下环境: 1.安装node  2.安装git 1.初始化项目 vue init webpack vue-elementui npm run dev 2.安装element np ...

  8. 【vue】vue项目引入 Element-UI

    根据vue项目的搭建教程,接下来记录下如何在Vue-cli创建的项目中引入Element-UI. 1.安装直接用命令 (推荐) npm install element-ui 2.直接在根目录下的pac ...

  9. vue项目引入bootstrap正确姿势

    vue如何引入bootstrap 最近在玩全栈,自然少不了vue的使用.使用vue-cli生成的项目想引入bootstrap,需要先安装相应的npm包,然后在代码中显示引入. 1.安装依赖包: cnp ...

随机推荐

  1. Zookeeper简介及安装(一)

    1 Zookeeper入门1.1 概述Zookeeper是一个开源的分布式的,为分布式应用提供协调服务的Apache项目. 1.2 特点 1.3 数据结构 1.4 应用场景提供的服务包括:统一命名服务 ...

  2. (71)一篇文章带你熟悉HTTP协议

    作者:涤生_Woo链接:http://www.jianshu.com/p/6e9e4156ece3來源:简书著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 本篇文章篇幅比较长,先 ...

  3. java把含小数点的数字字符串转换为int类型

    String num ="1.00"; int abc =Double.valueOf(num).intValue();//转换为Int类型

  4. Spring Cloud Stream教程(五)编程模型

    本节介绍Spring Cloud Stream的编程模型.Spring Cloud Stream提供了许多预定义的注释,用于声明绑定的输入和输出通道,以及如何收听频道. 声明和绑定频道 触发绑定@En ...

  5. SQL Server服务起不了

    转载 MSSQLSERVER服务无法启动的解决方案   1.IP地址配置不正确: 打开 Microsoft SQL Server 2005配置工具下的SQL Server Configuration ...

  6. sqli-lab(13)

    Double Injection- String- with twist(双注入 - 字符型 - 变形) 来进行我们的注入测试 直接闭合,用户名和密码输入“ ‘) or (‘1’) = (‘1%23 ...

  7. C#调用本地摄像头-AForge库简单使用

    介绍 AForge百度词条: https://baike.baidu.com/item/AForge.NET/114415?fr=aladdin 用途 调用笔记本电脑自带的相机 示例 源码 using ...

  8. POST上传多张图片配合Django接受多张图片

    POST上传多张图片配合Django接受多张图片 本地:POST发送文件,使用的是files参数,将本地的图片以二进制的方式发送给服务器. 在这里 files=[("img",op ...

  9. Oracle JET mobile cordove navigator.app对象

    在使用 Oracle JET 开发 webapp 时,会使用到 ojrouter ,ojrouter 默认含有历史记录推送功能.在调试 Android 时会发现返回键总是返回到上一次浏览记录(App ...

  10. Python 2 和 3 的区别及兼容技巧

    目录 目录 前言 Python 2 or 3 ? 不同与兼容 统一不等于语法 统一整数类型 统一整数除法 统一缩进语法 统一类定义 统一字符编码类型 统一导入模块的路径搜索方式 修正列表推导式的变量作 ...