iPhone 5 CSS媒体查询

Question

iPhone 5的屏幕更长，无法捕捉到我网站的移动视图。iPhone 5新增了哪些响应式设计查询，可以与现有iPhone查询结合使用吗？

我当前的媒体查询是这样的：

@media only screen and (max-device-width: 480px) {}

Answer 1

另一个有用的媒体功能是device-aspect-ratio。

请注意， iPhone 5没有16：9的宽高比 。实际上是40:71。

iPhone <5：
@media screen and (device-aspect-ratio: 2/3) {}

iphone 5：
@media screen and (device-aspect-ratio: 40/71) {}

iPhone 6：
@media screen and (device-aspect-ratio: 375/667) {}

iPhone 6 Plus：
@media screen and (device-aspect-ratio: 16/9) {}

iPad：
@media screen and (device-aspect-ratio: 3/4) {}