3.6 CSS字体
一、字体
在 CSS 中，我们使用 font-family 属性规定文本的字体。font-family 属性应包含多个字体名称，假如用户没有规定的字体，可以显示其他字体作为备用字体。
示例：
p {
font-family:"Microsoft YaHei", Arial, Helvetica, sans-serif;
}
注释：如果字体名称不止一个单词，则必须用引号引起来，例如："Microsoft YaHei"，“微软雅黑”，"宋体"。
二、字体样式
font-style 属性主要用于指定斜体文本。
此属性可设置三个值：
- normal - 文字正常显示
- italic - 文本以斜体显示
- oblique - 文本为“倾斜”（倾斜与斜体非常相似，但支持较少）
三、字体粗细
font-weight 属性指定字体的粗细：
| 值 | 描述 |
|---|---|
| normal | 默认值。定义标准的字符。 |
| bold | 定义粗体字符。 |
| bolder | 定义更粗的字符。 |
| lighter | 定义更细的字符。 |
| 100 200 300 400 500 600 700 800 900 |
定义由粗到细的字符。400 等同于 normal，而 700 等同于 bold。 |
| inherit | 规定应该从父元素继承字体的粗细。 |
示例：
<html>
<head>
<meta charset="utf-8">
<title>3.6 CSS字体</title>
</head>
<style>
span {
font-weight: bold;
}
</style>
<body>
<p>潭中鱼可<span>百许头</span>，皆若空游无所依，<span>日光</span>下澈，影布石上。——柳宗元《小石潭记》</p>
</body>
</html>
运行后如图：
四、字体大小
font-size 属性设置文本的大小。
在网页设计中，能够管理文本大小很重要。但是，不应使用调整字体大小来使段落看起来像标题，或是使标题看起来像段落。
请始终使用正确的 HTML 标签，例如 <h1> - <h6> 用于标题，而 <p> 仅用于段落。
font-size 值可以是绝对或相对大小。
绝对尺寸：
- 将文本设置为指定大小
- 不允许用户在所有浏览器中更改文本大小（可访问性不佳）
- 当输出的物理尺寸已知时，绝对尺寸很有用
相对尺寸：
- 设置相对于周围元素的大小
- 允许用户在浏览器中更改文本大小
注释：如果您没有指定字体大小，则普通文本（如段落）的默认大小为 16px（16px = 1em）。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>3.6 CSS字体</title>
</head>
<style>
h1 {
font-size: 40px;
}
h2 {
font-size: 30px;
}
p {
font-size: 14px;
}
</style>
<body>
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
</body>
</html>
运行后如图：
你觉得文章内容怎么样