ほとんどのメディアクエリでは、ビューポートの幅を使用して、電話、タブレット、またはPCにいるかどうかを判断します。私は無限のグリッドに1000sの小さな親指でイメージグリッドを構築しています。それぞれの親指は125pxで、ノートパソコン（MacBook 13 "）では9-10の親指を1列に簡単に収めることができます。これはユーザーエクスペリエンスが優れています.1080pxのNexus 5に同じコードを使用すると、私のアプローチは、デバイスがモバイルデバイスかpcデバイスかを検出することです。デバイスがモバイルデバイスであるか、デバイスであるかを検出することができます。しかし、もし私が幅を使うならば、私は基本的に最小幅を1100pxにして最も新しいものを捕まえる必要があります（例えば、250px）携帯電話は一般的にPC /ラップトップよりも高いDPIを持っています。CSSメディアクエリでモバイルと画面を区別する方法はありますか？
これは完全に間違っていますか？
私はReactにこのアプリを書いています。
あなたのNexus 5がウェブページを1080ピクセル幅でレンダリングしているわけではありません。あなたのサイトが携帯電話の画面に合わせて反応しないため、ズームアウトしたデスクトップサイトとして表示されます。
あなたのサイトの<head>に、このビューポートメタタグを追加する必要があります。
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
ことがでいたら、あなたのネクサス5が400ピクセル幅の広いに近い何かでWebページをレンダリングする必要があり、あなたがその周りのあなたのメディアクエリをベースにすることができます。ここで
は、あなたが480PX下にサムネイルワイド画面のワイド125pxを作ると思います方法は次のとおりです。
@media (max-width: 480px) {
img {
width: 125px;
}
}
これは甘くてシンプルです - 私はみんながどのように幅を書いているのだろうと思っていた...ありがとう – martin
解像度は、モバイルを検出するよりも優れたアプローチである - 錠剤は、例えば、大画面サイズで、モバイルユーザーエージェントを持っています。 – Skyler