メディア クエリ -->@media all AND (max-width: 1024) があります。これは Samsung タブレットでうまく機能しますが、PC ではなくタブレットにのみ適用する必要があります。デバイスが PC の場合、@media 画面と (最大幅: 768px) のみである必要があります。どうすればよいですか?
質問する
2108 次
3 に答える
1
メディア クエリでデバイス (PC、タブレット、ハンドヘルド) を確認することはできません。
この記事を読めば、より理解が深まるのではないでしょうか?
于 2013-03-06T14:03:23.730 に答える
0
メディア クエリはデバイス固有のものであってはなりません。単に「このサイズの出力にはこれを行い、別のサイズの出力にはこれを行う」と言うだけです。それが電話、PC、タブレット、キオスク、時計、またはその他のものであるかどうかは関係ありません。このため、メディア クエリでは、ハードウェア自体をクエリすることはできません。
デバイスの機能に基づいて (スタイルではなく) 異なる動作が必要になる場合があります。これは「タッチ」デバイスですか？ただし、これは CSS ではなく JS で管理する必要があります。
クエリの実際の目標は何ですか? タブレットだけでなく PC にも CSS を適用することは重要ですか?
于 2013-03-06T14:03:46.027 に答える
-1
簡単に言えば、そうではありません。
より長い答え：あなたは間違った方法でそれを行っています。
特定のデバイスをターゲットにするために画面幅を使用するという罠に陥りがちですが、それは不思議の国のアリスのウサギの穴です。なんで？モバイル デバイスの幅がデスクトップの幅と重なるためです。
たとえば、ここに画面幅のリストがありますが、どれがデスクトップだと思いますか?
1024
1366
1200
1080
何だと思う？あなたの推測は間違っているに違いない。1024 以上は「デスクトップ」の解像度のように見えますが、iPhone 5 Retina は 1136x640、第 3 世代 iPad は 2048x1536 です。さらに複雑なことに、多くのデスクトップ ユーザーはブラウザを最大化していないため、デバイスの幅はブラウザの幅と一致しません。そして、解像度は高いが文字サイズも大きくなる Kindle ではどうなるのだろうか？
また、より多くのデバイスが定期的に市場に投入されています。
それで、あなたの最善の策は？特定のデバイスまたはデバイス クラスをターゲットにするという考えを完全に放棄します。絶対に必要な場合は、JavaScript を使用してタッチ スクリーンを探します (これが、デバイスのクラスに合わせてインターフェイスを調整する必要がある最も可能性の高い理由です)。
メディア クエリを使用して幅をターゲットにすることもできます (または、私の経験では、プロポーショナル メディア クエリを使用することをお勧めします) が、特定のデバイスで必ずしも機能するとは思わないでください。
于 2013-03-06T14:10:30.813 に答える