css - 调整媒体查询以处理iPhone 5

我有一个可以正确显示iphone 6的网页。是否有一种简便的方法可以通过对iphone 5的媒体查询来调整屏幕尺寸，以便所有内容都能正常缩小？

我知道如何为Iphone 5触发CSS，这是一种轻松设置CSS的方法，因此，这只是为Iphone 5重新格式化的一个CSS命令。假设您已经为Iphone 6进行了全部工作，我们只是为Iphone 5设置了减小的宽度，是否可以自动缩小所有内容？

最佳答案

仅iPhone 5（人像模式）

@media only screen and (min-device-width: 320px) and (max-device-width: 568px)
and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:portrait)
{
   ...
}

仅iPhone 5（横向模式）

@media only screen and (min-device-width: 320px) and (max-device-width: 568px)
and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:landscape)
{
   ...
}

另一个有用的媒体功能是

device-aspect-ratio

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

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

关于css - 调整媒体查询以处理iPhone 5，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40792061/