私はメディアクエリを使用するのが初めてで、Googleでこれを検索しましたが、これを参照しているWebサイトを見つけましたが、実際の意味についての説明はありません.
これの違いは何ですか：
@media screen and (max-width: 767px),
screen and (max-device-width: 767px)
と：
@media screen and (max-width: 767px)
これら2つの違いは何ですか？最初の 1 つは、ページ コンテンツの幅とデバイスの幅、またはすべての方向 (水平または垂直) をターゲットにしていますか? 私はここで混乱しています。
メディア機能 widthと の違いdevice-widthについてではなく、2 つのメディア クエリ自体の違いについて質問していると仮定すると、クエリ内のコンマが論理 OR として機能することを知っておくと便利です。したがって、最初のクエリは次のようになります。
「最大幅が 767 ピクセルの画面の場合、または最大デバイス幅が 767 ピクセルの画面の場合...」</p>
max-width のみを照会する 2 番目のクエリに対して。カンマを含むクエリでは、最初が評価され、次に 2 番目が評価されます。これらのいずれかが true の場合、囲まれた CSS が適用されます。
http://www.w3.org/TR/css3-mediaqueries/#media0を参照
width と device-width がどのように機能するかについては、PPK のhttp://www.quirksmode.org/blog/archives/2010/09/combining_meta.htmlは、なぜ device-メディアクエリの幅、および違いの適切な説明。