応答性の高いデザインでは、Galaxy S4のような高解像度の携帯電話をどのように扱いますか？

これまで、ピクセル幅に基づいたメディアクエリを使用して、エンドユーザーがどのディスプレイを表示するかを判断しました。ただし、Galaxy S4（1080x1920）のような高解像度デバイスを使用している場合は動作しません。応答性の高いデザインでは、Galaxy S4のような高解像度の携帯電話をどのように扱いますか？

これはどのように処理しますか？

出典

2013-05-10 Drew Gorman

AFAIKピクセルはピクセルではないため、まだ動作しています。http://www.quirksmode.org/blog/archives/2010/04/a_pixel_is_not.html – Prinzhorn

正確には機能しません。 http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/ – cimmanon

まず、このような高解像度のデバイスでは、通常、ビューポートは[980px]にスケーリングされます。これを変更してネイティブ解像度を使用することができます。あなたの必要に応じて、 'ems'の基盤となるもので、この問題は自動的に機能します。ほとんどのデバイスは、 '1em'が読み込み可能なサイズに設定されています。これは、常にピクセルサイズに固定されている広告では、本当の問題になることがあります。 – Brad

あなたはメディアクエリがうまくいかないと思いますか？

明らかに、Galaxy S4のCSSピクセル比率は3.0です。その物理解像度は1080x1920ですが、そのCSS解像度は360x640ですが、Galaxy S3と似ています。

ピクセル密度をテストするメディアクエリもあります。高解像度画像やベクターグラフィックスをハイパーdpi機器に配信するのに役立ちます。

http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density#Samsung

http://bjango.com/articles/min-device-pixel-ratio/

Plusは、この記事を見てみましょう：

http://www.html5rocks.com/en/mobile/high-dpi/

画面仕様の恐ろしいデータベース

http://screensiz.es/phone

出典

2013-05-10 23:37:42 Evgeny

答えのすべてをありがとう、これは今私にとってもっと意味があります。 –

ない私は<head>にこれを追加し、それは私のために働いたあなたが応答設計に使用しますが、ブートストラップを使用しているフレームワークを確認してください。

<meta name="viewport" content="width=device-width, initial-scale=1.0">

これについていくつかの良い情報がここにあります：

http://www.html5rocks.com/en/mobile/mobifying/

具体的には、トピック「ビューポート」の下のセクションが質問に対処します。

出典

2014-04-27 01:26:41 ahaurat

応答性の高いデザインでは、Galaxy S4のような高解像度の携帯電話をどのように扱いますか？

答えて

関連する問題