我是新手使用媒体查询并在谷歌搜索这个但我刚刚找到网站引用这个但没有描述它们实际意味着什么。
这有什么区别：
@media screen and (max-width: 767px),
screen and (max-device-width: 767px)
并且：
@media screen and (max-width: 767px)
这两者有什么区别？第一个目标页面是内容宽度和设备宽度还是所有方向（水平或垂直）？我在这里很困惑。
答案 0 :(得分：2)
假设您没有询问媒体功能 width与device-width之间的区别，而是两个媒体查询本身之间的差异：了解它们很有用查询中的逗号用作逻辑OR。因此，第一个查询说，
“如果它是一个最大宽度为767px的屏幕，或者它是一个最大设备宽度为767px的屏幕......”
与仅查询max-width的第二个查询。在使用逗号的查询中，第一个将被评估，然后是第二个，等等。如果其中任何一个为真，则将应用随附的CSS。
请参阅http://www.w3.org/TR/css3-mediaqueries/#media0
就宽度和设备宽度的工作原理而言，PPK http://www.quirksmode.org/blog/archives/2010/09/combining_meta.html仍然是一个非常有用的读物，为什么人们可能想避免在媒体查询中使用设备宽度，以及对它的一个很好的解释差异。