移动web开发基础概念

物理像素（physical pixel） 也称设备像素（dp:device pixel）
css像素 也称逻辑像素（logical pixel）或者是设备独立像素（dip:device independent pixel）
实际开发中使用的像素，四个物理像素为一个css像素
设备像素比（dpr:device pixel ratio）
dpr = 设备像素/css像素（缩放比是1的情况下）一个方向上的
dpr = 2 表示1个css像素用22个设备像素来绘制
标清手机屏幕 dpr=1
高清手机屏幕 dpr>1
例如： 当前手机屏幕分辨率为1334750，css像素屏幕高宽是667*375，计算设备像素比是多少？（答案：2）---------只能选择一个方向，长和宽都是2
缩放
缩放改变的是css像素的大小
PPI
每英寸的物理像素点（ppi:pixels per inch）或者叫(dpi：dots per inch) 像素密度

视口

<meta name = "viewport" content ="width=device-width">

初始的缩放比

<meta name = "viewport" content ="initial-scale=1">

结合，user-scalable=no,不希望用户缩放

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

获取视口

var viewWidth = document.documentElement.clientWidth||window.innerWidth||document.documentElement.getBoundingClientRect().width);
//dpr
console.log(window.devicePixelRatio);