首页 > 其他分享 >vue中引入字体

vue中引入字体

时间:2022-11-25 09:55:08浏览次数:41  
标签:文件 vue 字体 引入 font css

前言: 做大屏 项目需要引入字体做个记录
一、先看看效果 

  

二、实现
1、下载字体文件

分享一个下载开源字体网站: https://www.dafont.com/theme.php
2、文件放到项目中

可以在src下的assets目录下新建一个font的目录(放在其他目录下一样可以),然后把下载的字体文件放入其中

3、创建css文件, 引入添加font-family

在font目录下创建一个css文件,自己随便取个名字,我用得是font.css:

 

 4、vue中全局引入字体

在main.js中引入刚才创建的css文件:

 

 5、在页面中使用字体

 

 这就搞定了

标签:文件,vue,字体,引入,font,css
From: https://www.cnblogs.com/wangyb56/p/16924210.html

相关文章

  • vue获取内网ip
    vue获取内网ip函数getIPs1(callback){varip_dups={};//compatibilityforfirefoxandchromevarRTCPeerConnection=window.RTCPeerConnection|......
  • Vue3学习(九)
    路由学习:1:路由传参<template><divclass="cls">这是电影<h2>{{$route.params.id}}</h2><h2>{{$route.params.type}}-{{$route.params}}<......
  • vue3中watch监听不是你想的那样简单
    vue3中watch监听数组,数组变化后未触发回调今天发生了一个很神奇的现象,就是我使用watch监听数组时。被监听的数组已经发生了变化。但是没有触发回调操作。当时的我感到......
  • Vue -- Mixin混入(二)
    前言使用Mixin混入自定义属性自定义属性:就是直接写在组件里的属性定义一个Mixin,并写入自定义属性 constmyMixin={num:1};创建vue实例,定义......
  • Vue项目打包后部署到express服务器
    背景有的时候我们在使用vue脚手架开发完项目后想在本地的服务器上运行进行调试,因为有的时候开发时和打包后的效果有些许差异。步骤安装expressnpminstallexpress-sa......
  • Vue脚手架,从入门到放弃
    创建Vue脚手架Vue脚手架是官方提供的标准化开发工具(最新4.x版本)网址:https://cli.vuejs.org/zh/guide/安装使用淘宝镜像源安装npminstall--location=globalcnp......
  • vue打包后405
    proxy只是解决了开发环境的跨域,线上依然会产生跨域的问题。上线时需要配置nginx!location^~/prod-api/{rewrite^/prod-api/(.*)$/$1b......
  • Vue
    前提Vue进度:https://www.bilibili.com/video/BV1Zy4y1K7SH/?p=6&spm_id_from=pageDriver&vd_source=81bee25537470aeb5c65db3a5bba55ac进度:第23节Vue2文档教程:......
  • 第一个 Vue 程序
    <body><scriptsrc="../vue.js"></script><divid="mydiv"><!--插值表达式-->{{message}}<!--在选中的元素中也会生效-->......
  • 前后端分离中,在vue中如何截取微信回调地址上的code参数?
    作者:迷彩摘要在前后端分离开发中,微信公众号、企业微信、小程序、开发中,经常会有授权登录的场景,但是授权登录场景肯定会有一个问题,就是接收微信的回调,同时前端要拿到回调地......