字号属性

最后更新：2026-09-13

font-size 字号属性

font-size 用于设置元素文本的字号大小，是最常用的文本样式之一。可以使用绝对关键字、固定长度或相对单位来控制文字尺寸。

font-size: xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller | <length> | <percentage>;

值	类型	描述
`xx-small \| x-small \| small \| medium \| large \| x-large \| xx-large \| larger \| smaller`	关键字	绝对大小关键字
`<length>`	类型	固定字号，如 16px
`<percentage>`	类型	相对父元素字号的百分比

编辑下方代码，在 playground 中查看实时效果：

浏览器	Chrome	Edge	Firefox	Safari	Opera
font-size	✓ v1	✓ v12	✓ v1	✓ v1	✓ v1
所有主流浏览器均支持

提示： 推荐使用相对单位（em/rem）设置字号，便于用户缩放和响应式适配。

注意： 避免使用 xx-small/x-small 等绝对关键字，不同浏览器渲染差异较大。

Qpx、em、rem 有什么区别？

Apx 是固定像素，不随上下文变化；em 相对父元素字号，嵌套会叠加；rem 相对根元素（html）字号，不受嵌套影响。响应式布局推荐 rem 或 clamp()，需要按父元素等比缩放时用 em，px 适合边框等不随字号缩放的值。

Q浏览器默认字号是多少？

A默认值是 medium，绝大多数浏览器对应 16px。设置 html { font-size: 62.5% } 后 1rem 等于 10px，便于按 10 的倍数换算，但注意它会影响所有使用 rem 的元素，需谨慎使用。

Qfont-size 的百分比怎么计算？

A百分比相对父元素的 font-size 计算：父元素 16px 时，font-size: 150% 即 24px。它随父元素字号等比变化，等价于 em，适合需要随上下文缩放的强调文本或列表。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。