vue全局引入字体并使用

一、下载字体文件

我这里只有D-DIN字体：https://download.csdn.net/download/weixin_45048913/19821026

二、将字体文件放到资源文件

我是放在自己建的一个文件里面的，另外同级还建了一个css文件

三、在css文件里面写入

@font-face {  font-family: 'din';  src: url('D-DIN.TTF');   font-weight: normal;  font-style: normal;  }

这里可以无限写哦

四、在main.js文件里面引入

import "./common/font/din.css";

五、页面使用

.class{font-family:'din' ;
}

vue全局引入字体并使用相关推荐

vue全局修改字体样式(修改成苹方)
惯例:先看最终效果: 1.首先你要先下载你需要的字体(这里以苹方为例) 2.在你的项目 src 文件下创建一个文件夹里面有两个文件, 一个是你需要的字体的文件,一个是 css 样式文件 3.其中 c ...
vue项目引入字体图标iconfont
直接将icon下载成图片使用,看此篇一.登入阿里字体图标库选择图标加入购物车下载代码: 解压后,将除了html的文件都复制一份到自己项目assets下: 二.点击打开之前解压的html文件推荐 ...
vue项目引入字体.ttf
1.下载所需要的字体,.ttf格式本文以(FZCYJ.ttf 为例) 2.在src下新建common文件,文件夹中包含以下文件 3.打开font.css @font-face { font-famil ...
vue项目引入字体样式
1.先下载好需要的字体样式,下载好的应该是个.ttf文件 2.在asset中创建fonts文件夹,将字体样式文件放进去,然后再到里面创建font.css文件 3.font.css文件里面进行引用 @f ...
vue中引入字体文件
在用vue来写一官网的时候,想引入外部字体文件,毕竟总感觉他自己的字体有点难看,在这里记录下 1.先下载字体文件所需的.ttf文件我这里想引入的是华文行楷字体百度后下载了一个3M多的ttf文件 2 ...
vue全局引入openlayers_vue中使用OpenLayers（一）：引入谷歌地图
vue中使用OpenLayers(一):引入谷歌地图第一步 npm install ol package.json 中可以看到第二步引入 import "ol/ol.css" ...
Vue中引入字体并解决字体文件过大问题
利用 CSS3 @font-face 规则指定名为"myFirstFont"的字体,并指定在哪里可以找到它的URL: @font-face {font-family: myFir ...
Vue中引入字体图标失败，显示方框（已解决）
问题描述: 在vue开发中,main中引入iconfont.css后,给标签添加相应类名后却不能正常显示,如下图解决方案: 其实问题很明显,就是忘了给i标签加上iconfont类名 <div ...
vue全局引入openlayers_vue项目中openlayers绘制行政区划
vue项目中openlayers画行政区划(区域范围),供大家参考,具体内容如下原理在地图上画需要的范围,实际上就是在地图上打上一圈点,然后依次将这些点用线连接,就形成了范围引用相应的ol模块 ...
vue全局自定义字体，提高项目字体美化

vue全局引入字体并使用

一、下载字体文件

二、将字体文件放到资源文件

三、在css文件里面写入

四、在main.js文件里面引入

五、页面使用

vue全局引入字体并使用相关推荐

最新文章

热门文章