CSS font-size
CSS font-size
CSS中的font-size属性用于指定字体的高度和大小。它影响元素文本的大小。它的默认值是中值，可以应用于每个元素。此属性的值包括
xx-small ，
small ，
x-small 等。
xx-small ，
small ，
x-small 等。
语法
font-size: medium|large|x-large|xx-large|xx-small|x-small|small|;
font-size设置字体的大小也可以是相对的或绝对的。
绝对大小
用于将文本设置为确定的大小。使用绝对大小，不可能在所有浏览器中更改文本的大小。当我们知道输出的物理大小时，这是有利的。
相对大小
它用于设置文本相对于其相邻元素的大小。 。使用相对大小，可以在浏览器中更改文本的大小。
注意：如果不定义字体大小，则对于普通文本（如段落），默认大小为16px，等于1em。
带像素的字体大小
当我们设置带像素的文本大小时，它将为我们提供对文本大小的绝对控制。
示例
<!DOCTYPE html>
<html>
<head>
<style>
#first {
font-size: 40px;
}
#second {
font-size: 20px;
}
</style>
</head>
<body>
<p id="first">这个段落的大小是40px。</p>
<p id="second">这个段落的大小是20px。</p>
</body>
</html>
<
输出：
输出：
这个段落的大小是40px。
这个段落的大小是20px。
带有em的字体大小
大多数开发人员更喜欢
em 设置字体大小而不是
px。万维网联盟（W3C）推荐em。浏览器中的默认文本大小为16px。因此，我们可以说
1em 的默认大小为
16px 。
em 设置字体大小而不是
px。万维网联盟（W3C）推荐em。浏览器中的默认文本大小为16px。因此，我们可以说
1em 的默认大小为
16px 。
px到
em 的计算公式为：
em = pixel/16 。
em 的计算公式为：
em = pixel/16 。
示例
<!DOCTYPE html>
<html>
<head>
<style>
#first {
font-size: 2.5em; /* 40px/16=2.5em */
}
#second {
font-size: 1.875em; /* 30px/16=1.875em */
}
#third {
font-size: 0.875em; /* 14px/16=0.875em */
}
</style>
</head>
<body>
<p id='first'>第一段。</p>
<p id='second'>第二段。</p>
<p id='third'>第三段。</p>
</body>
</html>
<
输出：
输出：
第一段。
第二段。
第三段。
响应字体大小
我们可以使用
vw单位来设置文本的大小，该单位代表"
视口宽度" "。视口是浏览器窗口的大小。
vw单位来设置文本的大小，该单位代表"
视口宽度" "。视口是浏览器窗口的大小。
1vw =视口宽度的1％。
如果视口的宽度为50cm，则1vw等于0.5厘米。
示例
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<body>
<p style="font-size:5vw;">第一段的宽度为1vw。</p>
<p style="font-size:10vw;">第二段宽度为2vw。</p>
</body>
</html>
第一段的宽度为5vw。
第二段宽度为10vw。
带有length属性的字体大小
它用于设置字体的长度。长度可以以cm，px，pt等为单位。在字体大小中，不允许
length 属性的负值。
length 属性的负值。
语法
font-size: length;
示例
<!DOCTYPE html>
<html>
<head>
<style>
.length {
color:red;
font-size: 1.5cm;
}
</style>
</head>
<body>
<h1>字体大小属性。</h1>
<p class = "length">长度为1.5cm的段落。</p>
</body>
</html>
字体大小属性。
长度为1.5cm的段落。