CSS媒体查询：桌面设备宽度

Question

我有一个与使用CSS媒体查询相关的特殊问题。 就像我们说iPad的设备宽度一样，我认为它始终返回768px（两个方向） 但是在桌面浏览器上，设备宽度的返回值究竟是什么？ 它与“宽度”在桌面媒体查询中返回的值有什么不同？

Answer 1

的规范，可以访问两个：

https://developer.mozilla.org/en/CSS/Media_queries

设备宽度：对输出设备的宽度（意味着整个屏幕或页面，而不仅仅是呈现区域，比如作为文档窗口）。

宽度：宽度介质特征描述了输出设备的渲染表面的宽度（例如文档窗口的宽度或打印机上的页面框的宽度）。

所以设备宽度是显示硬件的宽度，无论是手机本身还是桌面显示器。显然，由于屏幕大小对浏览器视口大小的影响不大，因此在桌面环境中不太有用。