我应该使用最大设备宽度还是最大宽度？
使用CSS媒体查询，您可以用于max-device-width定位设备宽度（例如iPhone或Android设备）和/或max- width定位页面宽度的。
如果使用max-device-width，则在更改桌面上浏览器窗口的大小时，CSS不会更改，因为您的桌面不会更改大小。
如果使用max-width，则在更改桌面上浏览器窗口的大小时，可能会显示面向移动的样式，例如触摸友好的元素和菜单等。
现在已不再针对特定的浏览器（和设备？）定位，并且您应该对目标对象有所了解。那也适用于媒体查询吗？
为什么要针对一个目标呢？ 推荐哪一个？
这是我在生产网站上使用的媒体查询的示例：
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (min-device-height: 480px) and (max-device-height: 640px) {
/* Change a menu to fit the screen better, etc... */
}
我倾向于同时使用max-device-width和max-width。
问题答案：
TL; DR
如果您要创建一个自适应网站，请在媒体查询中使用min-width/ max-width，而不是min-device-width/ max- device-width，以针对更大范围的屏幕尺寸。
根据2018年Media Queries Level4规范草案，不建议使用device-width媒体功能。保留它是为了向后兼容，但应避免使用。
8.附录A：不推荐使用的媒体功能
欲查询的视口的大小（或页面媒体页面箱），width，height和aspect-ratio媒体功能应该被使用，而不是device- width，device-height并且device-aspect- ratio，它指的是设备的物理尺寸，无论有多少空间可用于正在布置文件。所述device-*媒体特征有时也被用作代理，以检测移动设备。取而代之的是，作者应使用媒体功能，以更好地表现他们试图针对的设备外观。
附带说明，请记住在文档的部分中指定视口元标记<head>：
<meta name="viewport" content="width=device-width, initial-scale=1">
说明
由于给定设备可能具有所有不同的屏幕分辨率和像素密度，因此像素不是像素，因为要考虑很多因素（缩放，像素密度，屏幕分辨率和大小，设备方向，宽高比等）..）。在这种情况下，实际上将像素称为“光学参考单元”，而不是物理硬件像素。
幸运的是，您可以在文档的部分中指定视口元标记，<head>以控制浏览器视口的宽度和缩放比例。如果此标记的content值为width=device-width，则屏幕的宽度将与设备无关的像素相匹配，并确保所有不同的设备均应缩放并保持一致的行为。
<meta name="viewport" content="width=device-width, initial-scale=1">
在媒体查询方面，您可能要使用max-width而不是max-device-width，因为它的max- width目标是视口（当前浏览器窗口），而max-device-width目标是设备的实际全屏尺寸/分辨率。
换句话说，如果您使用max-device-width，则在调整桌面浏览器大小时将不会看到应用其他媒体查询，因为与不同max- width，仅考虑设备的实际全屏尺寸；不是浏览器窗口的当前大小。
如果您尝试创建自适应布局，这将产生巨大的差异，因为该站点在调整浏览器大小时将不会响应。此外，如果您使用max-device- width媒体查询来定位具有较小屏幕的设备，则即使将浏览器窗口的大小调整为与较小的屏幕尺寸匹配时，该查询也不适用于台式机。
截至2018年，最新的媒体查询规范草案实际上已弃用了device-width媒体功能，因此应避免使用它。
此外，关于GoogleDevelopers的这篇文章强烈建议不要使用max-device-width：
Google Developers-网络基础知识-响应式CSS媒体查询
也可以基于*-device-width; 创建查询；尽管 强烈反对 这种做法。
差异是微妙的，但非常重要：min-width基于浏览器窗口的大小，而min-device-width基于屏幕的大小。不幸的是，包括旧版Android浏览器在内的某些浏览器可能无法正确报告设备宽度，而是报告以设备像素为单位的屏幕尺寸，而不是预期的视口宽度。
此外，使用*-device-width可以防止内容在桌面或其他允许调整窗口大小的设备上适应，因为查询基于实际设备大小，而不是浏览器窗口的大小。
-
问题内容： 我有这个设置： HTML ： CSS ： 通过此设置，它可以在iPhone上运行，但不能在浏览器中运行。 是因为我已经在meta中，也许已经在？ 问题答案： 我发现最好的方法是为较旧的浏览器编写默认CSS，因为较旧的浏览器包括5.5、6、7和8。无法读取@media。当我使用@media时，我会这样使用： 但是，您可以使用@media进行任何操作，这只是为所有浏览器构建样式时最适合我的
-
问题内容： 我需要为iPhone / Android手机开发一些html页面，但是和之间有什么区别？我需要为不同的屏幕尺寸使用不同的CSS。 有什么不同？ 问题答案： 是目标显示区域的宽度，例如浏览器 是设备整个渲染区域的宽度，即实际设备屏幕 这同样适用于和自然。
-
我已经尝试了几个小时来解决这个问题，我正在努力，不管我做什么，它拒绝在我添加max-width或min-width的瞬间调用媒体标记中的CSS。为了测试，我让media标记使主体变红，并将min-width降低到可笑的低。什么都没发生。如果我留下屏幕标记而不留下任何其他东西，它就会调用它 CSS： HTML： 请原谅代码的绝对混乱，但我还没来得及清理这个问题，就在我对这个问题失去理智之前。
-
问题内容： 编写CSS媒体查询时，有什么方法可以使用“或”逻辑指定多个条件？ 我正在尝试做这样的事情： 问题答案： 使用逗号指定两个（或多个）不同的规则： 从https://developer.mozilla.org/en/CSS/Media_queries/ …此外，您可以在逗号分隔的列表中组合多个媒体查询；如果列表中的任何媒体查询为true，则将应用关联的样式表。这等效于逻辑“或”运算。
-
我的一个程序中的java类遇到了一个奇怪的问题。谢天谢地，我能够使用示例取自Oracle网站： https://docs.oracle.com/javase/tutorial/displayCode.html?code=https://docs.oracle.com/javase/tutorial/uiswing/examples/components/FrameDemoProject/src/c
-
我用的是木星笔记本。我有一个相当宽的屏幕，但是显示的输出（例如，当我打印一个数组时）被格式化，就像屏幕很窄一样。 我找到了一种增加细胞宽度的方法 但这似乎只影响输入，而不影响输出（参见屏幕截图）： 我已尝试在