5

縦向きと横向きの iPhone でページを別の方法で表示したいと考えています。

iPhone 4/4S デバイスではすべて正常に動作します (ポートレートおよびランドスケープ) が、iPhone 5/5s ではポートレート モードのみが正常に動作します (ランドスケープは通常の PC Web サイトを示しています)。

何が悪いのか知っていますか？

私のクエリは次のようになります。

ポートレート:

@media (max-width: 320px) {
...
}

風景：

@media (min-width: 321px) and (max-width: 568px) {
...
}

アップデート

私のクエリは次のようになります

@media (max-width: 320px) {
    ...
}

@media screen and (max-device-width: 568px) {
    ...
}

しかし、絵は同じです。iPhone 4/4S (縦/横) および iPhone 5/5s (縦) は動作しますが、iPhone 5/5s (横) は動作しません...

4

2 に答える 2

5

縦向きと横向きのメディア クエリがあります。

@media screen and (orientation:portrait) { 
    … 
}

@media screen and (orientation:landscape) {
    …
}

特に iPhone をターゲットにしたい場合は、こちらの優れたリソースをご覧ください: LINK

于 2013-11-05T13:55:01.440 に答える