聊一聊移动web分辨率的那些事儿
欢迎大家收看聊一聊系列，这一套系列文章，可以帮助前端工程师们了解前端的方方面面（不仅仅是代码）： http://my.oschina.net/MrHou/blog?catalog=477313&temp=1466755903794 1 PC到移动，渲染的变迁 在PC时代，我们书写CSS的时候，理所应当的认为，我们所书写的1px，在屏幕上就是1px的宽度。 但是到了移动端，事情就不是这样了，我们所书写的1px，其实到了屏幕上，可能是2px，可能是3px。甚至是你想多少px就多少px。这是为什么呢？让我们来说一个故~~~事~~~~~ 苹果发布ios的时候，肯定会想到成千上万的PC网页，没法在自己的IOS系统上运行起来时间多么蛋疼的事情啊。但是呢，这些网页都是按照PC屏幕的大小写的呀。 动不动就出现两个500多px的宽的div并列。这在当时640*960屏幕大小的iphone4上显示的话，简直是毁灭性的。(会各种折行，样式错乱)，那么细致如苹果肯定不允许这种事情发生。 于是苹果公司的攻城狮们想出了一个歪招，那就是告诉浏览器，“你在一个980宽的大屏幕下在渲染呢”， 浏览器就按照了980宽的方式，渲染出来页面图像。 可是到了浏览器这边，其实是拿到了一张渲染好的、比屏幕大的网页图像。 此时，苹果再把这张图像，缩放一下，缩为屏幕大小。 (我们平时也经常这样干，把一张大图片用双指放大缩小)