字体的大小,在网页中常见单位是px,印刷和word中,常用五号、四号等形式。
印刷常用字号和毫米对应关系
1英寸=72磅=2.54厘米;显示器的
px和pt(磅)之间的换算和DPI有关,DPI有些地方也称作PPI
1pt = DPI / 72 px
- Windows 的默认DPI是 96 (用户可以修改);
- Mac 的DPI是72
DPI=72时 1英寸显示72px, 1pt = 1px
DPI=96时 1英寸显示96个px, 1pt = 96 / 72 = 1.333px (9pt = 12px)
根据字号对应的磅值,可以得到下表的换算后数值
字号 | 磅 (pt) | 毫米 (mm) | 像素 (px) DPI=72 | 像素 (px) DPI=96 |
---|---|---|---|---|
八号 | 4.5 | 1.581 | 5 | 6 |
七号 | 5.25 | 1.845 | 5 | 7 |
小六 | 6.875 | 2.416 | 7 | 9 |
六号 | 8 | 2.812 | 8 | 11 |
小五 | 9 | 3.163 | 9 | 12 |
五号 | 10.5 | 3.690 | 11 | 14 |
小四 | 12 | 4.218 | 12 | 16 |
四号 | 14 | 4.920 | 14 | 19 |
三号 | 16 | 5.623 | 16 | 21 |
小二 | 18 | 6.326 | 17 | 24 |
二号 | 21 | 7.381 | 21 | 28 |
一号 | 28 | 9.841 | 28 | 37 |
小初 | 36 | 12.653 | 36 | 48 |
初号 | 42 | 14.761 | 42 | 56 |
网页中常用的单位
网页中除了px外,还会用到pt、rem, em,
- em 是指一个字母的宽度(最初指定的是字母M),因为网页默认字体是16px,所以 1em=16px;后来就固定下来了。这个单位会随着浏览器/操作系统放大字号而放大。(px指定的字体在早期IE下不会随着缩放字体而缩放),现在浏览器的缩放功能,都是对整个网页的放大缩小,已经不存在这个问题了。
- % 字体也可以用百分比指定大小,100% = 16px
- pt (win 1pt ≈ 1.333px; max 1pt = 1px)
- cm / mm / in in是inch英寸的缩写, cm是厘米mm是毫米和生活中用到厘米毫米没区别,1in = 2.54cm,这三个单位到px又和DPI相关了。 1in = DPI * 1px;
- ex 和em类似,用的是字母X的高度,很少有人用
CSS3中新增了几个长度单位
- ch字符0的宽度
- rem HTML标签元素的em数
- vm (viewpoint width), 1vm = viewpointwidth * 1%
- vh (viewpoint height), 1vh = viewpointheight * 1%
- vmin = min(viewpoint width, viewpoint height)
- calc(100% - 5px) 表达式,可以做点简单运算
viewpoint在做手机端网页时会用到