响应式设计不适用于 iphone 5s

【问题标题】：Responsive design not working in iphone 5s响应式设计不适用于 iphone 5s
【发布时间】：2014-11-09 17:53:45
【问题描述】：

我正在使用响应式设计，它在模拟器中完美运行 (http://iphone5csimulator.com/)。但是在 iphone5s 上，设计被破坏了。我使用像 @media (max-width: 320px) {} 这样的 css 样式。有没有其他方法让它变得完美？有没有其他模拟器可供测试？

在模拟器中

在 iPhone 中

【问题讨论】：

标签： css iphone responsive-design simulator

【解决方案1】：

/* iPhone 5 Retina regardless of IOS version */
@media (device-height : 568px) 
   and (device-width : 320px) 
   and (-webkit-min-device-pixel-ratio: 2)
/* and (orientation : todo: you can add orientation or delete this comment)*/ {
                 /*IPhone 5 only CSS here*/
}

或尝试使用@media screen

@media screen and (device-aspect-ratio: 40/71) {

}

查看浏览器堆栈，他们有很多移动模拟器..-Link

【讨论】：