用if else来判断，给<script>设置一个ID，再根据setAttribute改变src的属性。
@media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){/* 兼容iphone4/4s */
.class{}
}
@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2){/* 兼容iphone5 */
.class{}
}
分辨率可以从显示分辨率与图像分辨率两个方向来分类。
显示分辨率（屏幕分辨率）是屏幕图像的精密度，是指显示器所能显示的像素有多少。由于屏幕上的点、线和面都是由像素组成的，显示器可显示的像素越多，画面就越精细，同样的屏幕区域内能显示的信息也越多，所以分辨率是个非常重要的性能指标之一。
可以把整个图像想象成是一个大型的棋盘，而分辨率的表示方式就是所有经线和纬线交叉点的数目。显示分辨率一定的情况下，显示屏越小图像越清晰，反之，显示屏大小固定时，显示分辨率越高图像越清晰。
图像分辨率则是单位英寸中所包含的像素点数，其定义更趋近于分辨率本身的定义。
css具有媒体响应功能，可以判断屏幕宽度，从而加载设置的css
如下代码，当宽度小于1000px的时候加载css下的css-mobile.css
<link href="css/css-mobile.css" rel="stylesheet" type="text/css" media="screen and (max-width: 1000px)">如下代码，当宽度大于1000px的时候加载css下的css-pc.css
<link href="css/css-pc.css" rel="stylesheet" type="text/css" media="screen and (min-width: 1000px)">
