# CSS 单位
# 单位
- px
- pt
- em
- rem
- vw
- vh
- vmin
- vmax
# Pixel
物理像素/设备像素: 真实的设备像素 他是显示设备中一个最微小的物理部件
设备独立像素(density-independent pixel) 设备独立像素也称为密度无关像素，可以认为是计算机坐标系统中的一个点，这个点代表一个可以由程序使用的虚拟像素(比如说CSS像素)，然后由相关系统转换为物理像素
比如我们偶尔会说电脑屏幕在 2560x1600分辨率下不适合玩游戏，我们把它调为 1440x900，这里的分辨率（非严谨说法）指的就是设备独立像素。可以通过 window.screen.width/ window.screen.height 查看
另外，平时我们所说的 iphoneX 的逻辑分辨率375 x 812指的就是设备独立像素。
chrome检查元素模拟调试手机设备时显示如375x667和 320x480都是设备独立像素
- CSS像素
CSS像素是一个抽像的单位，主要使用在浏览器上，用来精确度量Web页面上的内容。一般情况之下，CSS像素称为与设备无关的像素(device-independent pixel)，简称
DIPs
浏览器使用的单位，用来精确度量网页上的内容，比如 div { width: 100px; }。 在一般情况下（页面缩放比为1），1个CSS像素 等于 1个设备独立像素。比如，假设把屏幕独立像素分辨率设置为1440x900，给页面元素设置为宽度720px，则视觉上元素的宽度是屏幕宽度的一半。这也解释了为什么当我们把独立像素分辨率调高后网页的文字感觉变小了。
当页面缩放比不为1时，CSS像素和设备独立像素不再对应。比如当页面放大200%，则1个CSS像素等于4个设备独立像素
屏幕密度 屏幕密度是指一个设备表面上存在的像素数量，它通常以每英寸有多少像素来计算(PPI)。
设备像素比(device pixel ratio) dpr
设备像素比 ＝ 物理像素 / 设备独立像素
dip或dp,（device independent pixels，设备独立像素）与屏幕密度有关。dip可以用来辅助区分视网膜设备还是非视网膜设备。
# 名词
PPI 每英寸像素数
# 1px问题 解决方案
# 参考
- Border-image_generator (opens new window)
- 7种方法解决移动端Retina屏幕1px边框问题 (opens new window)
- Viewport & Resolution (opens new window)
# 问题
1.CSS像素和分辨率的关系?