0

モバイル デバイス用のスタイルシートを作成しました。これでロードします：

<link rel="stylesheet" media="handheld, screen and (max-width: 650px)" href="/mobile.css?t=<?php echo rand(); ?>" />

私が持っているそのファイルの中に：

@media handheld, screen and (max-width: 650px) {
     -- Styles here
}

@media handheld, screen and (max-width: 446px) {
     -- Styles here
}

ブラウザのサイズを変更すると機能しますが、何らかの理由で少なくともAndroidでは通常のWebが表示されますか?

4

1 に答える 1

1

これが発生する理由はいくつかあります。

  1. お使いの Android はメディア クエリをサポートしていません。メディア クエリを認識しない Android デバイスがいくつかあります。あなたのドロイドもその 1 つかもしれません。

  2. メディア クエリは、解釈されていると思われる方法で解釈されていません。「ハンドヘルド (画面と最大幅: 650px)」をお探しですか、それとも最大幅 650px のハンドヘルド画面である必要がありますか? 前者を期待している場合、実際には後者を取得している可能性があります。その場合、「ハンドヘルド」として登録されているスマートフォンはほとんどないため、おそらくそのコードをトリガーすることはありません。

  3. 画面の幅は、あなたが思っているものではありません。1.5 インチ x 3 インチの画面を使用しているからといって、解像度が 650 ピクセルまたは 446 ピクセルに達するわけではありません。これらのスマートフォンが実現できる高密度のおかげで、ドロイドは実際にはデスクトップ モニターよりも解像度が高い場合があります。たとえば、iPhone5 は最初のクエリのみを読み取り、ポートレート モードでのみ読み取ります。これは、最小の辺が 640 ピクセルで、長い辺が 1136 ピクセルであるためです。Android OS がサポートする最大の解像度は、なんと 2560x1600 の解像度です!)

于 2012-12-10T18:46:45.127 に答える