Javascript 我应该如何为android和iphone实现媒体查询？

我有三组图像。其中一套我想用于iPhone4、5和iPad，我有两套安卓手机的图像，一套高分辨率，一套低分辨率不确定如何完成此任务。

我正在努力找出最好的方法。既然我想使用相同的图像，我可以对iphone和ipad使用一个媒体查询吗？或者我必须像这样检查iPhone4和5吗

    @media only screen and (min-device-width : 320px) and 
    (max-device-width : 568px) and    (orientation : landscape){
       // iPhone 5, load images.
    } 

    @media only screen and (-webkit-min-device-pixel-ratio : 1.5), 
    only screen and (min-device-pixel-ratio : 1.5) {
    // iPhone 4, load the same images.
    }

我可以检查一下它是安卓设备还是苹果设备吗？如果是这样的话，也许我可以有两个单独的CSS文件，只加载正确的一个，在正确的CSS文件中，我会加载正确的图像。我的项目基本上只包含javascript

---

如有任何解决此问题的建议，我们将不胜感激。

MediaQueries功能强大，但只能做到这一点

我找到的针对特定用户代理的最佳方法是

它的工作原理类似于，但不是为浏览器功能添加类，而是向

html

标记添加非常详细的用户代理类

---

希望这能有所帮助。

Willemlab-感谢您的回复。我来看看。我的第一个想法可能是将iOS图像用作非媒体查询（只是将其作为标准加载），并将媒体查询用于android图像。这可能不可能？当然可能。CSS的意思是“层叠”，这意味着如果你编写了一个更严格的规则，你几乎可以覆盖任何样式。