Chrome浏览器将font-size设置为12px以下时无效,字体会默认显示为12px。其他浏览器会正常显示。
原因:Chrome浏览器做了如下限制:
- font-size 有一个最小值 12px(不同操作系统、不同语言可能限制不一样),低于 12px 的,一律按 12px 显示。理由是 Chrome 认为低于 12px 的中文对人类是不友好的。
- 但是允许把 font-size 设置为 0。
- 这个 12px 的限制用户是可以自行调整的,可以进入 chrome://settings/fonts 设置为其他值。
解决方法:
- Chrome 29 版本之前,可以使用
-webkit-text-size-adjust: none;
来解除这个限制。29 版本后就不起作用了。 - 可以使用缩放来解决:
transform: scale(0.833333)
,但除了缩小字体之外,也会缩小其他一些属性,需要额外注意。 - 如果是手机端,可以使用rem为单位。