2012年8月刚刚开始接触前端移动开发，目前主要是安卓和ios系统手机。 一套代码需要安卓和ios都兼容，安卓方面已经有n款手机了。 当css码在这些手机上稍微解析差异或出现错误时，建立兼容性是必不可少的，实际上随着手机版本的更新，会产生一些差异
半年多来，我遇到了很多问题。 解决问题的过程很辛苦，很开心。 之所以辛苦，是因为刚接触，不懂很多知识。 需要花很多时间探索遇到的困难。 真开心啊。 当然，接触到新鲜手机的开发，很兴奋，学到了很多知识。 那么，不用说，从这次的主题开始，今天主要总结一下iphone手机的兼容方法。
概述：
[iPhone 4创新，retina
display绝对是最引人注目的道具。 依靠这个视网膜显示屏，iPhone
4的分辨率达到了640960
虽然是pixels，但是为了维持向后兼容性，采用了320480
定点。 也就是说，不进行变焦而显示通常的图像时，图像中的1个像素以4个像素显示。 另一方面，在显示retina图像的情况下，各像素对应于图像中的1个像素。
这样，旧的APP不用修改就能在iPhone上
在4中运行了——，虽然显示效果稍差，但内容并不仅限于左上角的1/4区域。
在网页上，pixel与point的比例称为device-pixel-ratio，通常的设备都是1，iPhone
4为2，部分安卓机型为1.5。 ]
在中，- WebKit-min-device-pixel-ratio :2可用于区分iphone(4/4s/5 )和其他手机
iPhone4/4s的分辨率为640*960
pixels、DPI为326，设备高度为480px
iPhone5的分辨率为640 * 1136像素，DPI仍然为326，设备高度为568px
那么，只要判断iphone手机的设备高度值，就可以区分iPhone4和iPhone5
使用css
通过CSS3的媒体查询
特性，可以写iPhone4和iPhone5的兼容代码~~。
方式一、直接写在样式中
@ media (设备- height 3360480 px ) and (-WebKit-min -设备- pixel-ratio :2 ).class ) }
@media(device-height:568px ) and (-WebKit-min-device-pixel-ratio :2 ).class { } media ) device-rate )媒体与(WebKit-min-device-pixel-p-ratio :2 )，) device-height:568px ) and ) WebKit-min-device-pixel
方法二，链接到另一个样式表，将以下代码
标签背面
link rel=' style sheet ' media=' (设备高度3360480 px ) and (-WebKit-min -设备速度33602 ) ) href line
使用JS
//根据高度判断是iPhone 4还是iphone5is phone4inches=(window.screen.height==480 ) )；
is phone5inches=(window.screen.height==568 )；
移动开发飞速发展，各种新设备层出不穷。 我们在向后兼容的同时，还需要不断地进行技术学习，跟上时代的步伐~