📜  如何使用 CSS 更改字体大小?(1)

📅  最后修改于: 2023-12-03 14:51:51.861000             🧑  作者: Mango

如何使用 CSS 更改字体大小?

在 CSS 中,我们可以通过 font-size 属性来更改字体大小。下面是具体的使用方法:

使用像素单位

像素(Pixel,简称 px)是一个绝对单位,意思是它的值与屏幕分辨率有关,而不随浏览器的设置而变化。因此使用像素单位来设置字体大小可以保证在不同设备上的表现一致。

p {
  font-size: 16px;
}

上述代码将 p 元素的字体大小设置为 16 像素。

使用 em 单位

em 是一个相对单位,它的值根据当前元素字体大小的倍数来确定。例如,如果一个标签的字体大小为 16 像素,那么其子元素的字体大小为 2em,即 32 像素。

p {
  font-size: 1.2em;
}

上述代码将 p 元素的字体大小设置为其父元素字体大小的 1.2 倍。

使用 rem 单位

rem 与 em 类似,但它相对于根元素的字体大小。因此,使用 rem 单位可以避免多层嵌套所带来的字体大小累加问题。

p {
  font-size: 1.2rem;
}

上述代码将 p 元素的字体大小设置为根元素的字体大小的 1.2 倍。

使用百分比单位

百分比与 em 单位类似,但它是相对于父元素的字体大小。因此,如果需要设置相对于父元素的字体大小的字体大小,可以使用百分比单位。

p {
  font-size: 120%;
}

上述代码将 p 元素的字体大小设置为其父元素字体大小的 120%。

通过以上方法,我们可以用 CSS 轻松地更改字体大小,以达到不同的视觉效果。