前言：在我们学习CSS的时候，主要学习选择器和常用的属性，而这篇文章讲解的就是最基础的属性之一——文字属性。
废话不多说，让我们直接开始！
CSS字体属性
先让我们看一下常用的字体属性有哪些：
目录
（1）文字大小
属性名： font-size
作用：用于控制字体的大小。
使用语法：
div {
font-size: /* 设置字体的大小 */;
}这里我们直接使用一个案例来加深理解：
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./2024.4.22.css">
</head>
<body>
<div>这是一段将要加粗的文字</div>
</body>
</html>CSS代码：
/* 将div标签中的文字大小改为40px */
div {
font-size: 40px;
}注意：
这样我们就了解了如何改变文字的大小。
（2）字体族
属性名： font-family
作用：用于控制字体类型。
使用语法：
div {
font-family: /* 添加文字类型 */
}我们直接使用一个案例来加深理解：
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./2024.4.22.css">
</head>
<body>
<div>这是一段将要修改文字类型的文字</div>
</body>
</html>CSS代码：
/* 将文字类型改为华文彩云，如果修改失败，则改为微软雅黑 */
div {
font-family: "华文彩云","微软雅黑",sans-serif
}注意：
这样我们就了解了如何改变文字的类型。
（3）字体风格
属性名： font-style
作用：用于控制字体是否为斜体。
使用语法：
div {
font-style: /* 设置文字是否倾斜 */;
}我们直接使用一个案例来加深理解：
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./2024.4.22.css">
</head>
<body>
<div>这是一段将要倾斜的文字</div>
</body>
</html>CSS代码：
/* 将文字设置为倾斜 */
div {
font-style: italic;
}注：实现斜体时，更推荐使用italic 。
这样我们就了解了如何使文字倾斜。
（4）字体粗细
属性名： font-weight
作用：用于控制字体的粗细。
使用语法：
/* 使用特定表示 */
div {
font-weight: bold;
}
/* 使用数值 */
div {
font-weight: 600;
}我们直接使用一个案例来加深理解：
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./2024.4.22.css">
</head>
<body>
<div>这是一段将要加粗的文字</div>
</body>
</html>CSS代码：
/* 将文字设置为粗体 */
div {
font-weight: bold;
}这样我们就了解了如何加粗文字。
（5）字体复合写法
属性名： font
作用：将上述所有字体相关的属性复合在一起编写。
感觉还是没有太懂，那我们使用一个案例来使你更好的理解：
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./2024.4.22.css">
</head>
<body>
<div>这是一段将要修改的文字</div>
</body>
</html>CSS代码：
/* 将文字设置为粗体，大小40px 文字类型为微软雅黑，如果设置失败则设置为华文彩云 */
div {
font: bold italic 40px "微软雅黑","华文彩云",sans-serif;
}注：实际开发中更推荐复合写法，但这也不是绝对的，比如只想设置字体大小，那就直接用font-size属性。
这样我们就了解了如何将文字的属性复合的写在一起了。
以上就是这篇文章的全部内容了~~~