3

奇妙なエラーがあります - タブレット (Nexys 7 2013 モデルを使用) を縦向きで起動すると正しいスタイルシートが読み込まれ、横向きに切り替えると正しいスタイルシートが読み込まれますが、縦向きに戻すと読み込まれませんポートレート スタイルシートをロードしません。何を与える？

関連コード:

<link rel="stylesheet" type="text/css"
      media="only screen and (max-device-width: 800px) and (-webkit-min-device-pixel-ratio: 2.0) and (orientation: portrait)"
      href="tablet_portrait.css">
<link rel="stylesheet" type="text/css"
      media="only screen and (max-device-width: 800px) and (-webkit-min-device-pixel-ratio: 2.0) and (orientation: landscape)"
      href="tablet_landscape.css">

切り替えた方向から戻るときに何をロードするかを決定するために、何らかのコードを入力する必要がありますか? 電話レイアウトでテストしていませんが、同じことをしていると思います。

ありがとう！

4

1 に答える 1

1

テストする nexus-7 はありませんが、この場合、メディア クエリに 1 つのスタイルシートを使用して、以下のようにリストします。このようにして、Web ページはシート間の切り替えを心配する必要がなくなります。

@media="only screen and (max-device-width: 800px) and (-webkit-min-device-pixel-ratio: 2.0) and (orientation: portrait) {
    styles here...
}

@media="only screen and (max-device-width: 800px) and (-webkit-min-device-pixel-ratio: 2.0) and (orientation: portrait) {
    styles here...
}
于 2013-10-10T18:50:47.073 に答える