在移动开发中，iPhone4的分辨率是640*960pixels，但是iPhone5的分辨率却是640*1136pixels，所以在兼容上面还是存在一些小问题的。
解决思路如下：
1.在网页中，pixel（像素）与point（点）比值称为device-pixel-ratio（设备像素），普通设备上是1，iPhone4上面是2，有些android机型是1.5.那么-webkit-min-device-pixel-ratio:2，用来区分iPhone（4/4s/5）和其他手机。
设备像素：设备像素又称物理像素，设备能控制显示的最小单位，我们可以把这些像素看做成显示器上一个个的点。
设备独立像素：（密度无关像素）可以认为是计算机坐标系统中的一个点，这个点代表一个可以由程序使用并控制的虚拟像素（例如，css像素，只是在android机中css像素就不叫“css像素”了而是叫“设备独立像素”）。
2.iPhone4的分辨率是640*960pixels，DPI是326,设备高度为480px。
iPhone5的分辨率是640*1136pixels，DPI是326,设备高度为568px。
因此，只需要判断iPhone手机的device-height（设备高度）值就可以了。
解决方法：
一、通过css3的Media Queries特性，在css3中可以直接写
@media（device-height：480px）and(-webkit-min-device-pixel-ratio:2){...}
/*兼容4/4s*/
@media（device-height：568px）and(-webkit-min-device-pixel-ratio:2){...}
/*兼容5*/
二、单独样式表，放在<head>标签里面
<link rel="stylesheet" media="(device-height:480px;) and (-webkit-min-device-pixel-ratio:2)" href="iphone4">
<link rel="stylesheet" media="(device-height:568px;) and (-webkit-min-device-pixel-ratio:2)" href="iphone5">