1

我在网上看到，做出响应式设计的最佳方式是使用 CSS@media查询。这似乎不是一个实用的解决方案，因为许多手机识别screen并具有与桌面显示器一样多的像素（即 iPhone 6 Plus 为 1080x1920，而一些 Android 手机的尺寸更大）。所以如果我说min-width: 800px;我的桌面设计，很多智能手机都会使用这些规则。

一种解决方法是navigator.userAgent在 JavaScript 中使用来检测移动设备，但我也听说这不是广泛兼容的。

是否有“最佳”方法来确定用户是否在移动设备上（最好使用 JavaScript 或 CSS）？

4

1 回答 1

1

如果将此代码添加到页面head，则视口的宽度将不是实际的像素数，而是可与 96dpi 的像素密度相比较的值：

<meta name="viewport" content="width=device-width"/>

这导致大多数智能手机的 CSS 宽度为 320 像素，即使它们的实际分辨率更高。

于 2015-07-17T22:20:56.793 回答