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

re:从0开始的CSS学习之路 6. 字体相关属性

news 2025/6/13 20:05:16

1. 字体相关属性

font-size 字体大小
font-family 字体的系列（字体簇）
可以设置多个字体，每个字体之间以逗号隔开
设置多个字体的目的是为了用户尽可能的支持字体
网页字体的五大类：
serif 衬线字体
sans-serif 非衬线字体
monospace 等宽字体
cursive 草书字体
fantasy 虚幻字体
若字体名称中包含空格，则必须使用双引号
font-weight 字体的粗细
可选值：
normal 正常显示（默认值）
bold 粗体
lighter 特细
bolder 特粗
"number" 利用数值指定粗细100-900，值后没有单位
400相当于normal 700相当于bold
font-style 字体的样式
可选值：
normal 正常显示
italic 斜体
（通常斜体使用相对较少，反而将斜体设置成normal）

字体的简写属性：font，使用一个font属性设置所有的相关属性
font:font-style font-weight font-size/line-height font-family

注意：

每个属性之间以空格隔开
font-size font-family 不可以省略并且必须按照顺序书写，其他可以省略

示例如下：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>h1 {font-size: 80px;font-family: monospace;}p {/* font-size: 30px;font-family: serif;font-weight: bolder;font-style: italic; */font: italic bolder 80px serif;}
</head><body><h1>天天好心情 I'M happy</h1><p>今天天气不错</p><p>挺风和日丽的</p><p>我们今天在上课</p><p>我心情挺好的</p>
</body></html>

re:从0开始的CSS学习之路 6. 字体相关属性

1. 字体相关属性 font-size 字体大小 font-family 字体的系列（字体簇） 可以设置多个字体，每个字体之间以逗号隔开设置多个字体的目的是为了用户尽可能的支持字体网页字体的五大类： serif 衬线字体 sans-serif 非衬线字体 monos…...

编程日记 2024/2/13 19:05:27

FPGA（基于xilinx）中PCIe介绍以及IP核XDMA的使用

Xilinx中PCIe简介以及IP核XDMA的使用例如：第一章 PCIe简介以及IP核的使用文章目录 Xilinx中PCIe简介以及IP核XDMA的使用一、PCIe总线概述1.PCIe 总线架构2.PCIe 不同版本的性能指标及带宽计算3.PCIe 接口信号二、XDMA1.XDMA 与其它 PCIe IP 的区别2.XDMA简介三…...

编程日记 2024/2/13 18:59:20

docker 运行jar包指定配置文件

要在Docker中运行JAR包并指定配置文件，你可以创建一个Dockerfile来定义你的容器环境，并在其中指定如何运行JAR包和配置文件。下面是一个简单的例子，展示了如何在Dockerfile中设置这些配置： 第一步：创建 Dockerfile文件…...

编程日记 2024/2/13 18:57:11

‘vue-cli-service‘ 不是内部或外部命令，也不是可运行的程序

遇到 vue-cli-service 不是内部或外部命令，也不是可运行的程序或批处理文件。的错误时，通常意味着Vue CLI没有被正确安装或配置在项目中。这可能是因为node_modules目录缺失了必要的包，或者局部安装的Vue CLI没有被正确设置到系统的PATH环境…...

编程日记 2024/2/13 18:49:02

用户信息修改实现后端修改用户昵称： /*** 更新用户昵称* param wxUserInfo* param token* return*/ RequestMapping("/updateNickName") public R updateNickName(RequestBody WxUserInfo wxUserInfo,RequestHeader String token){if(StringUtil.isNot…...

编程日记 2024/2/13 18:43:52

powershell 离线安装Posh-SSH

PowerShell 离线安装 Posh-SSH 模块，可以按照以下步骤进行： 从可靠的来源获取 Posh-SSH 模块的 NuGet 安装包（.nupkg 文件）。确保该安装包是最新版本，并且与你的 PowerShell 版本兼容。将 NuGet 安装包复制到你的计算…...

编程日记 2024/2/13 18:41:49

linux系统下vscode portable版本的c++/Cmake环境搭建002：使用 VSIX 安装VSCODE插件(暂记)

使用 VSIX 安装VSCODE插件在 Visual Studio Code (VSCode) 中，你可以通过以下步骤离线安装插件： 获取插件的 VSIX 文件： 在一个联网环境中，访问 Visual Studio Code Marketplace，搜索并找到你想要的插件。比如&am…...

编程日记 2024/2/13 18:40:48

PHP特性知识点总结

如果想观感更好看到图片，可以去我的gitbook或者github去看 github：https://github.com/kakaandhanhan/cybersecurity_knowledge_book-gitbook.22kaka.fun gitbook：http://22kaka.fun description: 专门出的关于php的特性比较，后面好像也有java的特性。 🏀 PHP特性知识点…...

编程日记 2024/2/13 18:39:47

数据库基本操作

一.DDL（Data Definition Language） 数据定义语言，该语言包括以下部分： 对数据库的常用操作对表结构的常用操作修改表结构不涉及数据不区分大小写二.对数据库的常用操作 1.查看所有的数据库 show databases; 2.创建数据…...

编程日记 2024/2/13 18:37:45

【51单片机】矩阵键盘（江科大）

6.1矩阵键盘矩阵键盘： 在键盘中按键数量较多时,为了减少I/O口的占用,通常将按键排列成矩阵形式采用逐行或逐列的“扫描”,就可以读出任何位置按键的状态 1.数码管扫描(输出扫描) 原理:显示第1位→显示第2位→显示第3位→ …… ,然后快速循环这个过程,最终实现所…...

编程日记 2024/2/13 18:35:43

Go语言教学（一）起源

目录一.Go语言来源二.Go语言应用一.Go语言来源 Go语言，又称Golang，是Google公司于2009年11月正式对外公开的一门编程语言。它是一门静态强类型、编译型的语言，其语法与C相近，但在功能上有所改进和增加，如内存安全…...

编程日记 2024/2/13 18:34:41

口腔助手|口腔挂号预约小程序|基于微信小程序的口腔门诊预约系统的设计与实现(源码+数据库+文档)

口腔小程序目录目录基于微信小程序的口腔门诊预约系统的设计与实现一、前言二、系统功能设计三、系统实现 1、小程序前台界面实现 2、后台管理员模块实现四、数据库设计 1、实体ER图 2、具体的表设计如下所示： 五、核心代码六、论文参考七、最新…...

编程日记 2024/2/13 18:33:40

ChatGPT高效提问—prompt常见用法（续篇三）

ChatGPT高效提问—prompt常见用法（续篇三） 1.1 多选项多选项技术为模型提供了一个清晰的问题或任务，并附带一组预先定义的潜在答案。这种方法在生成仅限于特定选项集的文本方面表现出色，适用于问答、文本补全和其他任务。利…...

编程日记 2024/2/13 18:30:36

IAR报错：Error[Pa045]: function “halUartInit“ has no prototype

在IAR工程.c文件末尾添加一个自己的函数，出现了报错Error[Pa045]: function "halUartInit" has no prototype 意思是没有在开头添加函数声明，即void halUartInit(void); 这个问题我们在keil中不会遇到，这是因为IAR编译器规则的一…...

编程日记 2024/2/13 18:28:32

C++三剑客之std::optional(一) : 使用详解

相关文章系列 C三剑客之std::optional(一) : 使用详解 C三剑客之std::any(一) : 使用 C之std::tuple(一) : 使用精讲(全) C三剑客之std::variant(一) : 使用 C三剑客之std::variant(二)：深入剖析目录 1.概述 2.构建方式 2.1.默认构造 2.2.移动构造 2.3.拷贝构…...

编程日记 2024/2/13 18:24:29

网络安全漏洞管理十大度量指标

当前，网络安全漏洞所带来的风险及产生的后果，影响到网络空间乃至现实世界的方方面面，通信、金融、能源、电力、铁路、医院、水务、航空、制造业等行业各类勒索、数据泄露、供应链、钓鱼等网络安全攻击事件层出不穷。因此，加强对漏…...

编程日记 2024/2/13 18:17:22

Swift Combine 发布者订阅者操作者从入门到精通二

Combine 系列 Swift Combine 从入门到精通一 1. Combine核心概念你只需要了解几个核心概念，就能使用好 Combine，但理解它们非常重要。这些概念中的每一个都通过通用协议反映在框架中，以将概念转化为预期的功能。这些核心概念是&#x…...

编程日记 2024/2/13 18:14:20

python 笔记：shapely（形状篇）

主要是点（point）、线（linestring）、面（surface） 1 基本方法和属性 object.area 返回对象的面积（浮点数） object.bounds 返回一个（minx, miny, maxx, maxy）元…...

编程日记 2024/2/13 18:13:18

开源的JS动画框架库介绍

开源的JS动画框架库介绍在现代网页设计中，动画已经成为提升用户体验的重要手段。它们不仅能够吸引用户的注意力，还能够帮助用户更好地理解和导航网站。JavaScript 动画框架库提供了一套丰富的动画效果，让开发者能够轻松地实现复杂的…...

编程日记 2024/2/13 18:12:17

MATLAB实现随机森林回归算法

随机森林回归是一种基于集成学习的机器学习算法，它通过组合多个决策树来进行回归任务。随机森林的基本思想是通过构建多个决策树，并将它们的预测结果进行平均或投票来提高模型的准确性和鲁棒性。以下是随机森林回归的主要特点和步骤： 决策树…...

编程日记 2024/2/13 18:09:00

基于大模型的 UI 自动化系统

基于大模型的 UI 自动化系统下面是一个完整的 Python 系统，利用大模型实现智能 UI 自动化，结合计算机视觉和自然语言处理技术，实现"看屏操作"的能力。系统架构设计 #mermaid-svg-2gn2GRvh5WCP2ktF {font-family:"trebuchet ms",verdana,arial,sans-…...

编程新知 2025/6/13 1:58:45

docker详细操作--未完待续

docker介绍 docker官网: Docker：加速容器应用程序开发 harbor官网：Harbor - Harbor 中文使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像是什么 Docker 是一种开源的容器化平台，用于将应用程序及其依赖项（如库、运行时环…...

编程新知 2025/6/12 22:35:08

ubuntu搭建nfs服务centos挂载访问

在Ubuntu上设置NFS服务器在Ubuntu上，你可以使用apt包管理器来安装NFS服务器。打开终端并运行： sudo apt update sudo apt install nfs-kernel-server创建共享目录创建一个目录用于共享，例如/shared： sudo mkdir /shared sud…...

编程新知 2025/6/11 15:31:57

R语言AI模型部署方案：精准离线运行详解

R语言AI模型部署方案：精准离线运行详解一、项目概述本文将构建一个完整的R语言AI部署解决方案，实现鸢尾花分类模型的训练、保存、离线部署和预测功能。核心特点： 100%离线运行能力自包含环境依赖生产级错误处理跨平台兼容性模型版本管理# 文件结构说明 Iris_AI_Deployme…...

编程新知 2025/6/12 14:51:45

el-switch文字内置

el-switch文字内置效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

编程新知 2025/6/12 23:22:28