css - iPad専用のCSS

Question

iPad では見た目が異なるページを作成する必要があります。これまでにこれを行ったことがないので、いくつか質問があります。

1) CSS の目的で iPad で表示されていることをページに知らせるにはどうすればよいですか?

2) ページの一部のコンテンツが iPad で異なる場合、どのデバイスがページを読み込んでいるかを php を使用して知るにはどうすればよいですか (これは css では実行できないため)。

score 2 · Accepted Answer

まず、2 番目の質問にお答えします。サーバー側のコードで特定のデバイスタイプを検出する唯一の方法は、ユーザーエージェントの解析を使用することです。PHP では、関数を使用してこれを行うことができます。この関数は、2 番目の文字列パラメーターが最初のパラメーターに含まれていない場合strpos()に返します。FALSE例えば：

$userAgent = $_SERVER['HTTP_USER_AGENT'];
if (strpos($userAgent, 'iPad') !== FALSE) {
    // load iPad-specific content
} else {
    // load content for other devices
}

最初の質問に答えると、CSS を使用して iPadのみを検出する方法はありません。メディアクエリを使用して 1024x768 ディスプレイをターゲットにすることもできますが、これらは (iPad だけでなく) その解像度のすべての画面に適用されます。iPad 固有の CSS スタイルを適用する場合は、前述の PHP コードを含む独自のスタイルシートを読み込みます。

ただし、ブラウザーの機能の変化、市場の傾向、またはユーザーエージェントのスプーフィングが考慮されないため、デバイスの検出は一般的に不適切な方法であることに注意してください。ほとんどの場合、CSS メディアクエリは、さまざまなデバイスをサポートするための、より堅牢で前向きなアプローチを提供します。なんで？特定のモデルではなく、デバイスの種類を対象としているためです。つまり、サイトは現在 iPad、Android、および Windows タブレットで正常に動作し、来年には市場に出回る最新の xyz デバイスで (コードの変更を必要とせずに) 正常に動作することを意味します。