了解 CSS font 各个单位的意义,搜了一些资料。
绝对单位
- cm (centimeter 厘米)
- mm (millimeter 毫米)
- in (inch 英寸)
- pt (point 点)
- pc (pica 派卡)
相对单位
em
有的文章(书)会提到 em 是指大写字母 M 的宽度([4] P57)。那是已经过时的说法,现在很多字体的 M 其实占不到 1em 的宽度。[2]
只用 em 和 px
例子来自 www.w3.org
0.5pt, 1px, 1pt, 1.5px, 2px
如果前面四根线看起来一样(或者 0.5pt 的看不见了),你应该是在用不能显示小于 1px 点的电脑显示屏。如果能看到线的厚度递增,你应该在看高质量电脑显示器或打印的纸张。如果 1pt 看起来比 1.5px 厚,你可能在用手持设备。
当需要排列文字与图片的时候用 px 比较合适。
而字体更好是用 em 。(一)不要设置 body 的 font 大小,因为默认大小是读者可以舒适阅读的大小。(二)用 em 设置其它元素大小,比如 2.5em 就是 body 字体的 2.5 倍大小。
只有在设置打印字体的时候才用 pt/cm/in 单位。
新型单位
- rem (root em 就是依据根元素字体大小的比值,em 会叠加,rem 不会)
- vw (window 宽度的 1/100)
- vh (window 高度的 1/100)