CSS font-size 属性

在网页开发中，font-size 属性用于设置元素的字体大小。字体大小可以以绝对单位（像素、英寸等）或相对单位（em、rem等）来指定。下面我们将详细介绍 font-size 属性的用法和一些注意事项。

语法

selector {
  font-size: value;
}

• selector 为要设置字体大小的元素选择器。
• value 可以是长度值（如 px、em、rem）或百分比值。

值

绝对单位

• px：像素（绝对长度单位，固定大小，不受用户设置影响）。
• in：英寸。
• cm：厘米。
• mm：毫米。
• pt：磅（1/72英寸）。
• pc：派卡（12磅）。

相对单位

• em：相对于父元素的字体大小。例如，如果父元素的字体大小为 16px，1em 等于 16px。
• rem：相对于根元素（html 元素）的字体大小。
• %：相对于父元素的百分比。

示例代码

// www.javascriptcn.com code example
h1 {
  font-size: 2em; /* 相对于父元素的字体大小的两倍 */
}

p {
  font-size: 16px; /* 固定大小为 16像素 */
}

span {
  font-size: 80%; /* 相对于父元素的字体大小的80% */
}

注意事项

• 使用相对单位（如 em、rem）可以帮助实现更好的响应式设计。
• 考虑到用户的可访问性，避免将字体大小设置得过小，以保证内容的可读性。
• 在移动设备上，建议使用相对单位，以便在不同屏幕尺寸上有更好的展示效果。