设备像素
物理像素 , 屏幕上的发光颜色变化的最小单位
小米4的屏幕，分辨率是1920设备像素*1080设备像素，意味着小米4手机横向上排列了1080个显像用的小点，在纵向上排列了1920个显像用的小点。
CSS像素
逻辑像素 , 并不真实存在的逻辑单位
PC端设备像素和设备独立像素数值默认相等
设备独立像素
坐标系统中的一个点 , 在不同的系统中有不同的表示 , 由系统转化为物理像素表示
设备独立像素已经包括了CSS 像素。
苹果手机分辨率
单位是 pt
视口
视口在CSS里的定义是<html>元素的包含块，称为初始包含块。它的宽度是所有CSS百分比宽度推算的根源。(块级元素的宽度默认为100%)
在桌面上，视口的宽度等同于浏览器窗口的宽度，高度即为浏览器窗口的高度。
响应设计
通过meta标签指定布局视口而不是使用默认的、宽度通常为980px的布局视口
通过媒体查询或者document.documentElement.clientWidth来根据布局视口的宽度的不同来做设计
通过媒体查询或者window.devicePixelRatio来根据DPR的不同来提供分辨率不同的图像
