移动开发

- physical pixel   物理像素值375*667           750*1334  当前浏览器的宽度

document.documentElement.clientWidth   document.documentElement.clientHeight

- device-independent pixel　　设备独立像素值  px

- device pixel ratio　　设备像素比 2       window.devicePixelRatio
- PPI　　每英寸的像素值    当PPI大于300为高清屏  PPI=（物理像素宽750*物理像素宽750+物理像素高1334*物理像素高1334）开根   再除以英寸（5.5）

iPhone6 plus屏幕像素值750 = 当前浏览器宽度 375* 设备像素比2

 

viewport

<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

width : 设置layout viewport 宽度，值为一个正整数，或字符串"width-device"
height：设置layout viewport 高度，这个属性很少使用
initial-scale：设置页面初始缩放值，值为一个数字，可以是小数
minimum-scale : 设置页面最小缩放值，值为一个数字，可以是小数
maximum-scale : 设置页面最大缩放值，值为一个数字，可以是小数
user-scalable : 是否允许用户进行缩放，值为"no"或"yes"

  

1REM = 32px
此时EM=24px

 VW是此时浏览器可视区域宽度的1%：

同理，VH就是高度的1%：