css 字体大小

作者：寂寞带点伤发布日期:2025-08-02 浏览:13

/* 设置字体大小的示例代码 */

/* 使用像素单位设置字体大小 */
p.pixel {
  font-size: 16px;
}

/* 使用相对长度单位 em 设置字体大小 */
p.em {
  font-size: 1.2em; /* 相对于父元素的字体大小 */
}

/* 使用相对长度单位 rem 设置字体大小 */
p.rem {
  font-size: 1.5rem; /* 相对于根元素 (html) 的字体大小 */
}

/* 使用百分比设置字体大小 */
p.percent {
  font-size: 150%; /* 相对于父元素的字体大小 */
}

/* 使用 vw 单位设置字体大小 */
p.vw {
  font-size: 5vw; /* 相对于视口宽度的百分比 */
}

解释说明：

像素 (px)：绝对单位，字体大小固定，不会随浏览器缩放而变化。
em：相对单位，相对于父元素的字体大小。1em 等于父元素的字体大小。
rem：相对单位，相对于根元素（即 <html> 元素）的字体大小。1rem 等于根元素的字体大小。
百分比 (%)：相对单位，相对于父元素的字体大小。例如，150% 表示字体大小是父元素的 1.5 倍。
视口宽度 (vw)：相对单位，相对于视口宽度的百分比。1vw 等于视口宽度的 1%。

上一篇：css 设置