常见样式问题六、CSS长度单位（px、em、rem等）及相关内容
一、基本长度单位
1、相对长度单位
- px：像素。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。同样尺寸的屏幕，分辨率越大，像素的物理尺寸越小（分辨率=屏幕横向的像素数量 *屏幕纵向的像素数量。所以像素大小 = 屏幕尺寸^2 / 分辨率）。windows系统使用的分辨率一般是96像素/英寸。而mac的用户所使用的分辨率一般是72像素/英寸。
- ex：所有字体中小写x的高度。目前很多用户代理会将1/2em作为ex的值。
- em：相对于当前元素内文本的字体大小。如当前行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。注意：对于字体来说，1em = 父元素的font-size；对于其他的，1em=元素的font-size。
- rem：font size of the root element，是CSS3新增的单位。和em类似，但是是以文档根元素<html>的字体作为参照。
2、绝对单位
绝对单位与屏幕分辨率无关，长度是固定的。绝对单位有：in、cm、mm、pt、pc。
1in = 2.54cm = 25.4mm = 72pt = 6pc。
in：英寸（Inch）；
cm：厘米；
mm：毫米；
pt：点（Point）;
pc：派卡（Pica）。相当于我国新四号铅字的尺寸。
下面是1英寸的高度：
72pt
↓
3、适用情况分析
| 推荐 | 偶尔使用 | 不推荐 | |
|---|---|---|---|
| 屏幕 | em, px, rem% | ex | pt, cm, mm, in, pc |
| 打印 | em,rem,cm, mm, in, pt, pc, % | px, ex |
打印宽度为cm、mm、in等绝对单位， 在CSS内与任何其它地方的意思都一样， 前提是你的输出装置的分辨率够高。在镭射打印机上， 1cm为准确的1cm。但在低分辨率的装置上(如电脑屏幕)，CSS不需要该精确度。 确实，在不同的装置，常会有不同的结果。这些单位最好是在高分辨率的装置或打印机上使用。在电脑屏幕以及手持装置上，可能得不到你所期望的结果。
二、px、pt、ppi、dpi、dp、dpr、sp之间的关系
1、px、pt
px：pixel，像素，电子屏幕上组成一幅图画或照片的最基本单元。
pt： point，点，印刷行业常用单位，一般等于1/72英寸。
1pt = (dpi / 72) px当dpi = 72时，1pt = 1px。
2、dpi
dpi是指dot per inch，用于打印机每英寸多少墨点，该值越高，则图片越细腻。
dpi最初用于衡量打印物上每英寸的点数密度。DPI值越小图片越不精细。
dpi= 屏幕对角线上的pt长度/对角线in长度 = （屏幕横向pt长度^2 + 屏幕纵向pt长度^2）/ 对角线in长度3、ppi（像素密度）
当DPI的概念用在计算机屏幕上时，就应称之为ppi。ppi是指pixel per inch，像素密度，每英寸像素数，该值越高，则屏幕越细腻。
ppi= 屏幕对角线上像素数/对角线in长度 = （屏幕横向像素数^2 + 屏幕纵向像素数^2）/ 对角线in长度电子屏幕中dpi = ppi。
4、dp（设备独立像素，又称逻辑像素）
dp（或dip）指Density-independent pixel, 设备独立像素，又称逻辑像素。dp是安卓开发用的长度单位，1dp指的是逻辑像素，在dpi=160时，1dp=1px，即1单位的逻辑像素= 1单位的物理像素。
1dp=（ppi/ 160）px安卓根据像素密度不同，分为以下几种规格：
| 密度 | ldpi | mdpi | hdpi | xhdpi | xxhdpi |
|---|---|---|---|---|---|
| 密度值(ppi) | 120 | 160 | 240 | 320 | 480 |
| 代表分辨率 | 240*320 | 320*480 | 480*800 | 720*1280 | 1080*1920 |
分辨率描述的是物理像素。根据分辨率、屏幕尺寸可以求出屏幕的密度值ppi。将ppi/160就是1dp的值。
比如屏幕分辨率为480*800，尺寸为3.7英寸。物理像素= (480^1/2 + 800 ^ 1/2)^1/2 = 933。ppi = 933 / 377=252。约等于240，所以应该1dp=(240/160)px=1.5px。即1单位逻辑像素=1.5单位物理像素。
5、dpr（像素设备比）
dpr指Device pixel ratio，中文叫像素设备比，指一个逻辑像素对应多少个物理像素。
像素有两种，一种是物理像素，一种逻辑像素。以前一个逻辑像素是等于一个物理像素的。当一个逻辑像素对应多个物理像素的时候，这时候，显示会更清楚。
通过window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。即：
dpr = window.devicePixelRatio = 物理像素 / 逻辑像素 = ppi /160逻辑像素 = 物理像素 * dpr。
6、sp
sp指scale-independent pixel，安卓开发用的字体大小单位。
dp和sp都是安卓的开发单位，dp是长度单位，sp是字体单位。sp与dp类似，但是可以根据用户的字体大小首选项进行缩放。Android系统允许用户自定义文字尺寸大小（小、正常、大、超大等等）。
当文字尺寸是“正常”时，1sp=1dp，而当文字尺寸是“大”或“超大”时，1sp>1dp。
参考文章：
上一篇： linux下常用的mysql 操作命令_MySQL
下一篇： 20190423 CTF题-web