2

私の Web アプリケーションは、複数のデバイスをサポートする必要があります。すべてのモバイル パッド デバイスに共通の CSS を作成しましたが、iPad で問題が発生しています。iPad専用の修正を見つけました。

ここで、iPad と Galaxy デバイスの CSS を分けたいと思います。

メディア クエリを実行する方法や、iPad 用の CSS と Galaxy デバイス用の CSS をロードする他の方法はありますか?

4

4 に答える 4

1

メディアクエリを使用して組み合わせを実行し、デバイスを検出してCSSをターゲットにすることができます。デバイスには特定のプロパティセット(解像度、向き、幅、高さなど)があり、メディアクエリを使用してデバイスを選択できます。これは、 MDNのリファレンスと、さらに参照するための別の記事、および同様の質問です。

于 2012-04-12T07:10:06.547 に答える
1

iPadやiPhoneなどのiOSデバイスのhttpリクエストユーザーエージェントを正規表現と比較することで非常に簡単に検出し、それに応じて関連するCSSを含めることができます。iPhone/iPadを検出するための単純な正規表現は次のようになります。

(iPhone|iPad).*?OS ((\d+)_(\d+))(?:_(\d+))?
于 2012-04-12T07:15:42.723 に答える
1

「iPad 専用の修正」とは、インストールされている Safari インスタンスの修正を意味する場合、機能検出を使用する必要があります。

指定された JS ライブラリを使用するのが最も簡単です。私はModernizrを好みます。

于 2012-04-12T07:33:27.003 に答える
1

使用できる唯一のメディア クエリは、何らかの理由でこれが十分でない場合 (画面が同じサイズであるか、モデルを知っている必要がある場合)、このスクリプトを使用してデバイスを識別し、読み込むことができる場合に、画面のサイズについて尋ねるものです。デバイスに応じた関連 CSS。

于 2012-04-12T07:13:50.397 に答える