iphone7的媒体查询

Question

我正在使用一些媒体查询，这些查询以横向和纵向为目标定位iPad和iPhone，但从iOS 7开始，它们不再起作用了。但是，它们在iOS 6中完美运行。有没有人有类似的经历？

Answer 1

确保在iPad查询之前已关闭所有媒体查询和媒体资源。下面是我用来确定iPad和方向的两个查询的示例：

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {}

或

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape){}

Answer 2

你应该试试这个：

//iPhone 7 in portrait & landscape

@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px) { /* STYLES GO HERE */}

//iPhone 7 in landscape
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : landscape) { /* STYLES GO HERE */}

//iPhone 7 in portrait
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : portrait) { /* STYLES GO HERE */ }

对于iPhone 7 Plus：

//iPhone 7 Plus in portrait & landscape
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px) { /* STYLES GO HERE */}

//iPhone 7 Plus in landscape
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : landscape) { /* STYLES GO HERE */}

//iPhone 7 Plus in portrait
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : portrait) { /* STYLES GO HERE */ }