PX的知识点：
在PC端中物理像素PX和CSS的像素是一模一样的， 桌面的1px就是css样式的1px，
但是在移动端中会出现问题：
比如iphone5的物理像素是640px＊1136px，但是它的界面大小只有320px＊568px；
因为手机的屏幕宽度有限，
在手机浏览器查看PC的网页总会出现一个界面显示不全的情况，所以要做特殊处理，
所以市面上的手机浏览器视图viewport做了统一，基本都为980px或者1024px，避免网页显示不全的问题；
但是移动互联网到来了， 我们要讲究用户体验， 给用户看的网站字不能太小， 按钮不能太小， 所以要解决这个问题；
width＝device－width的意思是让一整个浏览器的宽度为设备宽度；
而且不同设备的device－width不同的；
但是会有一个问题：
假设有一个移动设备的宽度为340px，
那么他的viewport就是340px；
如果一个div超过了340，
就会溢出并且出现滚动条；
我们用其他移动设备宽度大于340px的进行测试：
就会出现滚动了，因为移动设备的宽度是不定的，
所以移动互联网讲究的都是百分比布局， 和px说再见
ppi和dpi是一样的，都是英寸内的像素密度；
dpr是一个倍数： 物理像素／实际宽度
天道酬勤
