0

私はこのメディアクエリを持っています:

@media only screen
and (max-width : 320px),

only screen
and (max-device-width : 320px)
and (min-device-pixel-ratio : 2),

only screen
and (max-device-width : 320px)
and (-webkit-min-device-pixel-ratio : 2),

only screen
and (max-device-width : 320px) {

幅320px未満のデスクトップ上のブラウザ、縦向きのiphone 4を選択しますが、横向きのiphone4も選択します。確かに、これは横向きのiPhone 4を選択するべきではありませんか?

私の理解では、最初の部分は幅が320px未満の画面を選択します。

2番目の部分は2番目と同じですが、Webkitベンダープレフィックスが付いています

3番目の部分では、幅が320ピクセル未満で、ピクセル密度が2倍のモバイルデバイス(この場合はiPhone 4 / 4s)の画面を選択します。

4番目の部分は前の2つと同じですが、2倍のピクセル密度がないため、最大幅320pxの画面を持つiPhone3gsおよびその他のモバイルデバイスを選択する必要があります。したがって、上記に基づいて、iPhoneで横向きモードを選択することを期待していませんか?

それを解決するためにそれに追加する方法はありますか?

ニール

4

1 に答える 1

0

orientation : landscape次のように、CSSに追加する必要があります。

@media only screen
and (max-device-width : 320px)
and (orientation : landscape) {
    /* Styles */
}
于 2012-06-17T16:13:07.380 に答える