当前位置： 首页 > news >正文

前端引入字体文件

news 2026/5/20 21:03:17

1. 字体下载

  1. 阿里矢量图图标库地址 https://www.iconfont.cn/，页面打开后选中，素材库 > 字体库
    在这里插入图片描述
  2. 左侧两个标签页可以切换，右侧放大镜图标可以搜索自己需要的字体
    在这里插入图片描述
  3. 字体预览区域可以自行调整进行字体预览
    右上角点击字体包下载，下载字体文件
    在这里插入图片描述
  4. 解压字体压缩包
    在这里插入图片描述
    在这里插入图片描述

2. 示例代码

<!DOCTYPE html>
<html lang="en">
<head><style>body{ font-size: 60px; }/* 定义字体变量 */@font-face {/* myfont 设置字体使用时的名字 */font-family: 'myfont';/* 字体引用路径（引入任意一个字体文件即可） */src: url('./SmileySans-Oblique.otf');/* src: url('./SmileySans-Oblique.ttf'); *//* src: url('./SmileySans-Oblique.woff'); *//* src: url('./SmileySans-Oblique.woff2'); */}#text {/* 使用字体 */font-family: 'myfont';}</style>
</head>
<body><div>这是普通文本：红红火火恍哈哈哈哈</div><div id="text">设置字体后的文本：红红火火恍哈哈哈哈</div>
</body>
</html>

3. 效果展示

在这里插入图片描述

相关文章：

前端引入字体文件

1. 字体下载 阿里矢量图图标库地址 https://www.iconfont.cn/&#xff0c;页面打开后选中&#xff0c;素材库 > 字体库 左侧两个标签页可以切换&#xff0c;右侧放大镜图标可以搜索自己需要的字体 字体预览区域可以自行调整进行字体预览 右上角点击字体包下载&#xff0c;下…...

编程日记 2024/12/23 5:08:28

qemu启动后网络怎么设置？配合qemu-system-riscv64的命令设置

QEMU启动的时候&#xff0c;可以选择组网方式&#xff0c;一般有两种选择&#xff0c;user模式和tap模式 user模式就是用NAT&#xff0c;tap模式就是用bridge网桥模式。以前也有过一次实践&#xff1a;FreeBSD RISCV 在QEME中实践-网络配置_pkg.txz: not found-CSDN博客 user…...

编程日记 2024/12/23 5:07:26

如何测量分辨率

一、什么是分辨率&#xff1f; 分辨率指的是分清物体细节的能力。分辨率是一个成像系统还原空间频率的能力。一些人只是简单的用分辨率去描述极限分辨率&#xff0c;但是相机在在不同的对比度的情况下还原低&#xff0c;中和高频率的能力&#xff0c;也可以显示全面综合的信息。…...

编程日记 2024/12/23 5:02:18

汇总贴：cocos creator

1 cocoscreator-doc-TS:目录-CSDN博客 访问节点和组件 常用节点和组件接口 创建和销毁节点 加载和切换场景 获取和设置资源 监听和发射事件 节点系统事件 缓动系统&#xff08;cc.tween&#xff09; 使用计时器 使用对象池 使用 TypeScript 脚本 模块化脚本 脚本执行顺序 全局…...

编程日记 2024/12/23 4:57:13

[N1CTF 2018]eating_cms

[N1CTF 2018]eating_cms 知识点 文件上传 解题 这个题感觉还好&#xff0c;知识点真心不难&#xff0c;就是全混在一起。 思路差不多挺离谱 首先看到&#xff0c;有一个登录界面&#xff0c;然后猜测有注册界面 admin注册不了&#xff0c;随便注册一个账号。 注册之后&…...

编程日记 2024/12/23 4:56:12

重拾设计模式--建造者模式

文章目录 建造者模式&#xff08;Builder Pattern&#xff09;概述建造者模式UML图作用&#xff1a;建造者模式的结构产品&#xff08;Product&#xff09;&#xff1a;抽象建造者&#xff08;Builder&#xff09;&#xff1a;具体建造者&#xff08;Concrete Builder&#xff…...

编程日记 2024/12/23 4:53:10

【机器学习】以机器学习为翼，翱翔网络安全创新苍穹

我的个人主页 我的领域&#xff1a;人工智能篇&#xff0c;希望能帮助到大家&#xff01;&#xff01;&#xff01;&#x1f44d;点赞 收藏❤ 在数字化浪潮汹涌澎湃的当下&#xff0c;网络安全如同守护数字世界的坚固堡垒&#xff0c;其重要性不言而喻。而机器学习技术的蓬勃…...

编程日记 2024/12/23 4:50:07

人工智能在VR展览中扮演什么角色？

人工智能&#xff08;AI&#xff09;在VR展览中扮演着多重关键角色&#xff0c;这些角色不仅增强了用户体验&#xff0c;还为展览的组织者提供了强大的工具。 接下来&#xff0c;由专业从事VR展览制作的圆桌3D云展厅平台为大家介绍AI在VR展览中的一些主要作用&#xff1a; 个性…...

编程日记 2024/12/23 4:44:02

mysql,创建数据库和用户授权核心语句

一.库操作1.创建库create database if not exists 库名 default 字符集 default 校对规则2.删除库drop database if exists 库名3.修改库的,字符集,校对规则alter databse 库名 default 字符集 default 校对规则4.查看当前使用的库seclect databse();5.查看库show databases;…...

编程日记 2024/12/23 4:40:59

日期区间选择器插件的操作流程

我们知道&#xff0c;在开发过程中&#xff0c;为了能够在规定时间内完成项目&#xff0c;有时候我们都会使用插件来大大提高我们的开发效率&#xff0c;有些插件是可以直接拿来用&#xff0c;但是有些插件拿过来之后是需要进行修改&#xff0c;在使用插件的时候还有很多的注意…...

编程日记 2024/12/23 4:36:54

【WRF教程第3.2期】预处理系统 WPS详解：以4.5版本为例

预处理系统 WPS 详解&#xff1a;以4.5版本为例 WPS 嵌套域&#xff08;WPS Nested Domains&#xff09;USGS 和 MODIS 土地利用重力波拖拽方案静态数据&#xff08;Gravity Wave Drag Scheme Static Data&#xff09;1. 什么是重力波拖拽方案&#xff08;GWDO&#xff09;静态…...

编程日记 2024/12/23 4:33:50

深度学习的DataLoader是什么数据类型，为什么不可用来索引

在 Python 中&#xff0c;DataLoader是torch.utils.data.DataLoader类的实例对象&#xff0c;用于加载数据&#xff0c;它本身不是一种基本数据类型&#xff0c;而是一种特殊的迭代器类型&#xff0c;主要用于按批次加载数据&#xff0c;以下是其通常不可索引的原因&#xff1a…...

编程日记 2024/12/23 4:28:46

物理信息神经网络（PINN）八课时教案

物理信息神经网络&#xff08;PINN&#xff09;八课时教案 第一课&#xff1a;物理信息神经网络概述 1.1 PINN的定义与背景 物理信息神经网络&#xff08;Physics-Informed Neural Networks&#xff0c;简称PINN&#xff09;是一种将物理定律融入神经网络训练过程中的先进方…...

编程日记 2024/12/23 4:23:40

Linux setfacl 命令详解

文章目录 Linux setfacl 命令详解一、ACL 和 setfacl 简介二、基本语法三、常用操作1. 查看 ACL2. 为用户设置权限3. 为组设置权限4. 删除 ACL 条目5. 设置默认 ACL6. 递归设置 ACL 四、示例操作1. 创建示例目录和文件2. 设置 ACL3. 验证 ACL 五、注意事项六、总结 Linux setfa…...

编程日记 2024/12/23 4:21:38

电商环境下的财务ERP系统架构

先介绍一下自己的工作经历&#xff0c;2002年开始进入ERP实施行业&#xff0c;专注于O记EBS系统&#xff0c;正好赶上中国经济和信息化高度发展的阶段&#xff0c;先后实施过很多大国企和民企的大型ERP项目&#xff0c;在实施过程中逐渐对ERP系统的架构、模块设计有更深入的认识…...

编程日记 2024/12/23 4:19:37

Linux相关概念和易错知识点（25）（信号原理、操作系统的原理、volatile）

目录 1.信号的产生 &#xff08;1&#xff09;kill &#xff08;2&#xff09;raise、abort 2.对block、pending、handler表的管理 &#xff08;1&#xff09;信号集&#xff08;sigset_t&#xff09; &#xff08;2&#xff09;block表的管理 ①操作相关的函数 ②sigpr…...

编程日记 2024/12/23 4:16:34

线上问题——频繁 Full GC 问题的排查思路

文章目录 一、查看 GC 日志二、分析内存泄漏三、检查对象生命周期四、优化代码五、调整垃圾回收策略六、使用监控工具 一、查看 GC 日志 启用 GC 日志 在 Java 应用中&#xff0c;需要在启动参数中添加适当的参数来启用 GC 日志记录。可以使用-XX:PrintGCDetails、-XX:PrintGCD…...

编程日记 2024/12/23 4:14:30

《探秘 Qt Creator Manual 4.11.1》

《探秘 Qt Creator Manual 4.11.1》 一、Qt Creator 4.11.1 概述二、功能特性全解析&#xff08;一&#xff09;跨平台能力展示&#xff08;二&#xff09;代码编辑优势&#xff08;三&#xff09;版本控制集成&#xff08;四&#xff09;特定 Qt 功能呈现&#xff08;五&#…...

编程日记 2024/12/23 4:13:29

level2逐笔委托查询接口

沪深逐笔委托队列查询 前置步骤 分配数据库服务器 查询模板 以下是沪深委托队列查询的请求模板&#xff1a; http://<数据库服务器>/sql?modeorder_book&code<股票代码>&offset<offset>&token<token>查询参数说明 参数名类型说明mo…...

编程日记 2024/12/23 4:12:27

在Linux系统安装配置 MySQL 和 hive，hive配置为远程模式

前提&#xff1a;已安装配置好了Hadoop环境&#xff0c;因为hive的底层是Hadoop 1 Mysql安装 搜索Centos7自带的mariadb rpm -qa|grep mariadb 卸载mariadb rpm -e mariadb-libs-5.5.64-1.el7.x86_64 --nodeps 再搜索一次看看是否还存在 rpm -qa|grep mariadb 安装mysql 创…...

编程日记 2024/12/23 4:10:25

深度解析Linux内核task_struct：从进程管理到性能调优

1. 项目概述&#xff1a;从一行代码到操作系统的心脏 如果你写过C语言程序&#xff0c;一定用过 int main() &#xff0c;程序启动后&#xff0c;操作系统会为它创建一个“进程”。在Linux的世界里&#xff0c;这个进程在操作系统内核眼中&#xff0c;到底是什么样子的&#…...

编程新知 2026/5/20 20:50:27

革命性3步实现黑苹果自动化：OpCore Simplify智能化配置完全指南

革命性3步实现黑苹果自动化&#xff1a;OpCore Simplify智能化配置完全指南 【免费下载链接】OpCore-Simplify A tool designed to simplify the creation of OpenCore EFI 项目地址: https://gitcode.com/GitHub_Trending/op/OpCore-Simplify 还在为复杂的OpenCore配置…...

编程新知 2026/5/20 19:42:24

Awesome-Dify-Workflow：重新定义AI工作流编排的模块化解决方案

Awesome-Dify-Workflow&#xff1a;重新定义AI工作流编排的模块化解决方案 【免费下载链接】Awesome-Dify-Workflow 分享一些好用的 Dify DSL 工作流程&#xff0c;自用、学习两相宜。 Sharing some Dify workflows. 项目地址: https://gitcode.com/GitHub_Trending/aw/Aweso…...

编程新知 2026/5/20 18:50:07

Cat-Catch终极指南：5步快速掌握网页资源抓取技巧

Cat-Catch终极指南&#xff1a;5步快速掌握网页资源抓取技巧 【免费下载链接】cat-catch 猫抓 浏览器资源嗅探扩展 / cat-catch Browser Resource Sniffing Extension 项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch 你是否曾在网上看到一个精彩的视频教程…...

编程新知 2026/5/20 18:43:50

Karpathy 加入 Anthropic 真相：不是人才争夺，是「用 AI 训练 AI」的自我加速时代

先想象一个场景 2026 年初&#xff0c;你是一家 AI 实验室的 CTO。预算有限&#xff0c;买不起 OpenAI 那量级的 GPU。你有三个选择&#xff1a; A. 追着头部跑&#xff0c;花 80% 的钱买算力&#xff0c;剩下 20% 养团队——永远比别人慢半步 B. 放弃预训练&#xff0c;专注…...

编程新知 2026/5/20 18:16:39

2026 国内大厂 Java 最全面试真题（含场景方案+数据库+分布式必问）

开源一套金三银四自刷的面试题库&#xff0c;自己感觉还不错&#xff0c;也拿了几个 Offer&#xff08;三个大厂的&#xff0c;字节、蚂蚁、滴滴&#xff09;&#xff01;下面直接上干货哈&#xff01;需要获取得话可以在文末免费领取JVM 篇&#xff08;87 道&#xff09;JVM 篇…...

编程新知 2026/5/20 18:16:39

CH340G模块除了下载程序，还能这么玩？一个硬件调试小技巧分享

CH340G模块的隐藏技能&#xff1a;用串口调试提升硬件开发效率 当你拿到一片CH340G模块时&#xff0c;第一反应可能是"这是个下载程序的好工具"。确实&#xff0c;这个价格亲民的小模块在51单片机开发中扮演着重要角色。但今天&#xff0c;我要分享的是它另一个被低估…...

编程新知 2026/5/20 17:25:42

迪文串口屏界面开发避坑指南：T5L_DGUS Tool变量地址设置与数据通信那些事儿

迪文串口屏界面开发避坑指南&#xff1a;T5L_DGUS Tool变量地址设置与数据通信实战解析 在工业控制、智能家居和物联网设备的人机交互界面开发中&#xff0c;迪文串口屏因其高性价比和易用性广受欢迎。然而&#xff0c;当开发者从基础界面制作进阶到实际数据通信时&#xff0c;…...

编程新知 2026/5/20 16:20:43

RK3576+Hailo-8异构计算：破解高帧率摄像头实时AI分析算力瓶颈

1. 项目概述&#xff1a;从“看得见”到“看得懂”的实时化挑战最近在折腾一个智能安防的项目&#xff0c;客户提了个听起来简单但做起来挠头的要求&#xff1a;他们希望摄像头不仅能24小时不间断录像&#xff0c;还要能“实时”分析画面里发生的事——比如识别出有人闯入、车辆…...

编程新知 2026/5/20 15:52:46

agent 学习路径解析 学习资源分享

文章目录 先给结论&#xff1a;你接下来不要优先读 GLM-4.5你对 agent 的轻视&#xff0c;有一半对&#xff0c;一半错关于 Claude Code 泄露&#xff1a;你应该学“架构收获”&#xff0c;不要沉迷“源码猎奇”你提到的 learn-claude-code 仓库&#xff1a;值得看&#xff0c;…...

编程新知 2026/5/20 14:21:20