本⽂主要介绍在编写⽹⻚中可能会⽤到的字体单位
⽹⻚中定义字体时可能会⽤到的字体单位：px、em、%、rem、pt、vm、vh 等。
1. 字体单位
1.1 px
px是pixel缩写，是基于像素的单位（屏幕上显示数据的最基本的点）。⽤像素定义的的⽂字、图⽚等会随屏幕的分辨率变化⽽变化。如果在定义字体⼤⼩时，使⽤px作为单位，分辨率调⾼，实际看到的⽂字就变“⼩”。
1.2 em
em是⼀个相对⻓度单位，最初是指字⺟M的宽度，故名em。现指的是字符宽度的倍数，⽤法类似百分⽐，如：
0.8em，1.2em，2em等。通常1em=16px（⼀般浏览器默认的字体⼤⼩为16px）。
注：当⽤于指定字体⼤⼩时，em单位是指⽗元素的字体⼤⼩
1.3 %
百分与“em”类似，1em=100%。当前的字体⼤⼩等于100%，字体⼤⼩也是受⽗类影响。
1.4 rem
rem是CSS3新增的⼀个相对⻓度单位，只相对根⽬录即HTML元素。所以可以在html标签上设置字体⼤⼩为标准，⽂档中的字体⼤⼩都会以此为参照。
如：
CSS
html{font-size:62.5%;/* 10÷16=62.5% */}body{font-size:12px;font-size:1.2rem;}p{font-
size:14px;font-size:1.4rem;}
兼容性：IE9+，Firefox、Chrome、Safari、Opera 的主流版本都⽀持，为了兼容不⽀持 rem 的浏览器，我们需要在rem 前⾯写上对应的 px 值，这样不⽀持的浏览器可以优雅降级。
1.5 pt
PT是point(磅)缩写，是⼀种固定⻓度的度量单位,⼤⼩为1/72英⼨（96dpi）。如果在web上使⽤pt做单位的⽂字，字体的⼤⼩在不同屏幕下⼀样（DPI精度⼀样），但在Word中使⽤pt相当⽅便。因为使⽤Word主要⽬的都不是为了屏幕浏览，⽽是输出打印。当打印到实体时，pt作为⼀个⾃然⻓度单位就⽅便实⽤了。
pt 相关公式：1in =2.54cm =25.4 mm = 72pt = 6pcpx = pt * DPI /72（⼀般电脑屏幕的打印精度是
96dpi）
注：⽤在屏幕浏览（屏幕效果）时，pt和px都会随屏幕分辨率的变化⽽变化。⽤在打印（打印效果）时，使⽤pt在不同的屏幕分辨率或不同的DPI精度时显示⼤⼩⼀样，只是DPI精度越⾼的越清晰。
1.6 vw / vh
100种不同的字体
vw 相对于视区的宽度：视区宽度是100vw。
vh 相对于视区的⾼度：视区宽度是100vh。
注：视区”所指为浏览器内部的可视区域⼤⼩，即window.innerWidth/window.innerHeight⼤⼩，不包含任务栏标题栏以及底部⼯具栏的浏览器区域⼤⼩。部分浏览器可能不⽀持该度量单位。
1.7 其它字体单位
1．in：英⼨；
2．cm：厘⽶；
3．mm：毫⽶；
4．pc:pica，⼤约12pt，1/6英⼨；
5．ex：取当前作⽤效果的字体的x的⾼度，在⽆法确定x⾼度的情况下以0.5em计算（部分浏览器⽀持，⽤的较少就不详述了）；
6．ch：以节点所使⽤字体中的“0”（零）字符为基准，不到时为0.5em（部分浏览器⽀持，⽤的较少就不详述了）；
2. 字体单位使⽤建议
1．在⽹⻚开发时建议使⽤px、rem、em字体单位，⼀般浏览器默认字体⼤⼩是16px，可以先让根元素html为
10px，如：html{font-size:62.5%;}，然后使⽤em，或rem来设置个标签元素的字体⼤⼩；
2．如果是需要打印的⽂档就需要使⽤pt来作为字体单位，实际的打印字体清晰度会根据DPI/PPI（打印精度）变化。
3. 相关词汇
3.1 屏幕分辨率
屏幕分辨率是指屏幕显示的分辨率。显示分辨率就是屏幕上显示的像素个数，分辨率160×128的意思是⽔平⽅向含有像素数为160个，垂直⽅向像素数128个。屏幕尺⼨⼀样的情况下，分辨率越⾼，显示效果就越精细和细腻。
3.2 DPI/PPI pixel（dot）per inch
DPI即每英⼨点数，是⼀个量度单位，⽤于点阵数码影像，指每⼀英⼨⻓度中，取样、可显示或输出点的数⽬。DPI是打印机、⿏标等设备分辨率的度量单位。是衡量打印机打印精度的主要参数之⼀，⼀般来说，DPI值越⾼，表明打印机的打印精度越⾼。
如果⼀台打印机的分辨率是4800×1200dpi，那么意味着在X⽅向（横向）上，两个墨点最近的距离可以达到1/4800英⼨；在Y⽅向（纵向）上，两个墨点的距离可以达到1/1200英⼨。
注：PPI类同DPI。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。