移动网络的最大设备宽度和最大宽度之间有什么区别？

Question

移动网络的最大设备宽度和最大宽度之间有什么区别？我需要为iPhone/Android手机开发一些html页面，但两者之间有什么区别呢？max-device-width和max-width？我需要使用不同的CSS不同的屏幕大小。@media all and (max-device-width: 400px)@media all and (max-width: 400px)有什么关系呢？

Answer 1

max-width是目标显示区域的宽度，例如浏览器

max-device-width是设备的整个呈现区域的宽度，即实际的设备屏幕

同样也适用于max-height和max-device-height自然的。

Answer 2

max-width引用视区的宽度，可用于将特定的大小或方向与max-height..使用多重max-width(或min-width)当浏览器调整大小或在iPhone之类的设备上改变方向时，您可以更改页面样式。

max-device-width指设备的视口大小，而不论其方向、当前大小或大小。这在设备上不会改变，因此当屏幕旋转或调整大小时，不能用于切换样式表或CSS指令。