致谢
一直以来移动端适配便是困扰自己的一个难题，今天休息，查阅了很多资料将其整理出来。本文中很多做法是直接借鉴了网上的文章，主要有从网易与淘宝的font-size思考前端设计稿与工作流跟手机端页面自适应解决方案—rem布局进阶版（附源码示例），向大神致谢。
移动设备的分辨率
| 设备 | 屏幕尺寸 | 逻辑分辨率(pt) | Reader | 物理分辨率(px) |
|---|---|---|---|---|
| iPhone 3GS | 3.5寸 | 320*480 | @1x | 320*480 |
| iPhone 4/4S | 3.5寸 | 320*480 | @2x | 640*960 |
| iPhone 5/5S/5C | 4.0寸 | 320*568 | @2x | 640*1136 |
| iPhone 6/6S | 4.7寸 | 375*667 | @2x | 750*1134 |
| iPhone 6/6S Plus | 5.5寸 | 414*736 | @3x | 1242*2208 |
- pt是逻辑分辨率，简单理解就是跟屏幕的尺寸有关系，是个长度跟视觉的单位。
- px是物理分辨率，简单理解为像素点，跟屏幕的尺寸是没关系的。
小结：pt与px的关系是，一个单位的pt里包含几个px，包含的px越多，则越清晰。但因为人视网膜的关系，最多只能识别单位pt里2个像素点，大于2个像素点，人眼识别不出，所以6plus看上去不会比6更清晰。
