CSS使用自己的字体

在项目的根目录下的static文件夹中放置字体文件。在项目中使用这个字体,需要2个步骤。

一. 你需要在全局样式文件中引入它。

假设你的全局样式文件是App.vue或者App.vue中引入的App.scss文件,你可以像这样引入字体文件:

@font-face {
  font-family: 'Invention_A_Rg';
  src: url('~@/static/Invention_A_Rg.ttf') format('truetype');
}

在这个例子中,~@是UniApp中引入根目录的别名。你也可以直接使用相对路径引入字体文件,比如../static/Invention_A_Rg.ttf

二. 在你需要的盒子的class使用这个字体

在你的样式中使用font-family: 'Invention_A_Rg';来指定这个字体了。

比如我想在class未 time 的盒子想使用这个字体

   .time {
          font-size: 28rpx;
          font-family: 'Invention_A_Rg', sans-serif;
          font-weight: 400;
          color: #606060;
        }

打开调试,看是否生效

成功

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/546923.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

深度学习体系结构——CNN, RNN, GAN, Transformers, Encoder-Decoder Architectures算法原理与应用

1. 卷积神经网络 卷积神经网络(CNN)是一种特别适用于处理具有网格结构的数据,如图像和视频的人工神经网络。可以将其视作一个由多层过滤器构成的系统,这些过滤器能够处理图像并从中提取出有助于进行预测的有意义特征。 设想你手…

MySQL中的存储过程详解(上篇)

使用语言 MySQL 使用工具 Navicat Premium 16 代码能力快速提升小方法,看完代码自己敲一遍,十分有用 拖动表名到查询文件中就可以直接把名字拉进来中括号,就代表可写可不写 目录 1.认识存储过程 1.1 存储过程的作用 1.2 存储过程简介…

C#基础|数据类型、变量

哈喽,你好啊,我是雷工! 01 数据类型 数据类型是为了方便存储数据的,为了将数据按照不同的分类存储,所以引入数据类型。这个在PLC中已经很熟悉了。 数据类型的作用:就是为了更好地管理内存,为…

顺序表 (头删 尾删 清空)

//头删 | 1 #include "head.h" | 1 #ifndef ww87 void head_del(p lp) | 2 int main(int argc, const char *argv[]) …

[C++][算法基础]求最小生成树(Kruskal)

给定一个 n 个点 m 条边的无向图,图中可能存在重边和自环,边权可能为负数。 求最小生成树的树边权重之和,如果最小生成树不存在则输出 impossible。 给定一张边带权的无向图 G(V,E),其中 V 表示图中点的集合,E 表示图…

民航电子数据库:[E14024]事务内变更操作次数超过最大许可值10000,可通过系统参数max_trans_modify适当调整限制

目录 一、场景二、异常情况三、原因四、排查五、解决 一、场景 1、对接民航电子数据 2、执行delete语句时报错 二、异常情况 三、原因 通过报错信息就可以看出,是系统参数max_trans_modify配置导致 当删除的数据量 > max_trans_modify时,删除就会…

Visual studio项目默认“Header Files”、“Source Files”等过滤器消失后展开的方法。

使用Visual Studio进行项目开发创建默认工程的解决方案资源管理器里查看项目文件,所有的文件是按照其所属的类型自动归类,例如:.h头文件自动划归到Header Files文件夹,.cpp文件自动划归到Source Files文件夹下,如下图所…

关于AG32 MCU的一些奇思妙想

1、AG32VF103的网口是100M还是10M? RE: 都是100M的。 2、用FPGA能不能再仿出一个网口?有些产品用到两个网口。 理论上可以,但是要考虑,一个是cpld实现难度,一个是需要的逻辑单元。因为mac逻辑多,内置的2KL…

Python Flask Web 框架-API接口开发_4

一、1、安装 Falsk 当前用户安装 pip3 install --user Flask 确认安装成功: 进入python交互模式看下Flask的介绍和版本: $ python3>>> import flask >>> print(flask.__doc__)flask~~~~~A microframework based on Werkzeug. Its …

快速掌握Spring监控(Spring Boot admin)

监控 监控可视化监控平台Admin底层逻辑info 自定义端点 监控 监控的作用: 监控服务状态是否宕机监控服务运行指标(内存,虚拟机,线程,请求等)监控日志管理服务(服务下线) 监控的实…

linux进阶篇:使用Apache搭建文件服务器目录

Linux服务搭建篇:使用Apache搭建文件服务器目录 一、关于文件服务器 ​ 在一个项目中,如果想把公共软件或者资料共享给项目组成员,可以搭建一个简易的文件服务器来实现,只要是在局域网内的成员都可以通过浏览器或者wget命令来下…

书生·浦语大模型全链路开源体系-第5课

书生浦语大模型全链路开源体系-第5课 书生浦语大模型全链路开源体系-第5课相关资源LMDeploy基础配置LMDeploy运行环境下载internlm2-chat-1_8b模型使用Transformer来直接运行InternLM2-Chat-1.8B模型使用LMDeploy以命令行方式与InternLM2-Chat-1.8B模型对话设置KV Cache最大占用…

wps使用Latex编辑公式没有Latex formula

wps使用Latex编辑公式没有Latex formula 1. 下载CTEX2. 下载LaTeXEE3. 配置Miktex4. 配置latexee5. 用管理员权限运行latexeqedit.exe6. wps插入latex公式 1. 下载CTEX 下载CTEX网址,我下载的下图这个,下载完了之后运行exe文件安装ctex。 2. 下载LaTe…

视频国标学习

总体介绍 GB/T28181协议,全名叫《安全防范视频监控联网系统信息传输、交换、控制技术要求》,是由中国国家标准委员会发布的一种国家级的标准。它主要对视频监控系统的各个方面做了明确的规定,使得不同厂商生产的视频监控设备能够相互连通&am…

【C++】<入门>C++入门基础知识

C入门 1. 入门0. 本节知识点熟悉目的1. C关键字(C98) 2. 命名空间2.1 命名空间定义2.2 命名空间使用 3. C输入&输出4. 缺省参数4.1 缺省参数概念4.2 缺省参数分类 5. 函数重载5.1 函数重载概念5.2 C支持函数重载的原理--名字修饰(name Ma…

IntelliJ IDEA 2023中文--让编程更高效、更智能

IntelliJ IDEA 2023是一款功能强大的集成开发环境(IDE),专为Java开发者打造。它以其智能、高效和人性化的特点,帮助开发者更快、更好地编写代码。IntelliJ IDEA 2023支持多种语言和框架,包括Java、Kotlin、Spring等&am…

SpringCloud之LoadBalancer负载均衡器的简单使用

SpringCloud之LoadBalancer负载均衡器的简单使用 loadbalancer用于对提供服务的集群做一个节点的选取规则。 如图所示&#xff0c;load balancer集成在调用方 示例 创建loadbalance-base模块,并引入相关依赖 <dependencies><dependency><groupId>org.spr…

Unity笔记之下拉刷新列表

这样的效果&#xff1b; 代码&#xff1a; using System; using System.Collections; using System.Collections.Generic; using Sirenix.OdinInspector; using UnityEngine; using UnityEngine.EventSystems; using UnityEngine.UI;public class ScrollRectUpdateView : Mon…

解锁创意无限,体验全新Adobe Illustrator 2021 for mac/Win中文版

在数字化创意的浪潮中&#xff0c;Adobe Illustrator 2021中文版无疑是设计师们的得力助手。这款软件集高效、便捷、创新于一体&#xff0c;无论是Mac还是Windows用户&#xff0c;都能在其中找到属于自己的创意空间。 Adobe Illustrator 2021中文版延续了其强大的矢量图形处理…

5.2 mybatis之autoMappingBehavior作用

文章目录 1. NONE关闭自动映射2. PARTIAL非嵌套结果映射3. FULL全自动映射 众所周知mybatis中标签< resultMap >是用来处理数据库库字段与java对象属性映射的。通常java对象属性&#xff08;驼峰格式&#xff09;与数据库表字段&#xff08;下划线形式&#xff09;是一 一…