iPad の向きに応じて横向きと縦向きを表示する HTML/CSS を作成する必要があるという要件があります。最初は HTML と CSS を使用してこれを作成し、後で iPad に使用したいと考えています。開発。
私の質問は、これを達成するための最良の方法は何ですか? 2 つの異なる html/css ファイルを用意し、デバイスの向きに応じてそれらをロードすることは理にかなっていますか、それともこれを実装する他の方法はありますか。これに関する情報をいただければ幸いです。
ありがとうラークス
16038 次
1 に答える
4
これを実現するためにレスポンシブウェブデザインを使用することを検討したいと思います。画面のサイズに応じて、適用するスタイルを決定できます。縦向きの場合、画面が広くなることを忘れないでください。
あなたがすることは、2つの異なるスタイルシートを作成することです。1つはポートレートの場合、もう1つはランドスケープの場合です。次に、CSS3メディアクエリを使用して2つを切り替えます。
サンプルコード：
肖像画：
<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 768px)" href="portrait.css" />
風景：
<link rel="stylesheet" type="text/css" media="screen and (min-device-width: 1024px)" href="landscape.css" />
ご覧のとおり、ターゲットメディアを渡し、各スタイルシートのターゲット幅を宣言しています。縦向きのスタイルシートは、画面の現在の幅が768ピクセル以下の場合にのみ適用されます。逆に、2番目のスタイルシートは、画面の解像度が1,024ピクセル以上の場合にのみ適用されます。
テクニックを説明するオリジナルのAListApartの記事。
iPadの開発では、ネイティブアプリケーションを意味する場合、これは機能しません。ネイティブアプリケーションの場合、デバイスの向きを決定するためにcocoaフレームワークを使用する必要があります。ただし、ネイティブアプリケーションでWebビューを使用しているだけの場合は、これで問題なく動作します。
お役に立てれば。
于 2012-01-06T12:47:39.603 に答える