禁用移动设备的横向模式答案

【问题标题】：Disable landscape-mode for mobile devices禁用移动设备的横向模式
【发布时间】：2014-07-02 15:36:52
【问题描述】：

您好，我使用这个创建了一个响应式移动网站：

max-width(480px) {etc..} 

+

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

对于每个移动设备，网站看起来都一样 => 很棒。

但是当我更改为横向时，有超过 480px 和桌面显示的网站变体。

即使超过 480 像素，是否有可能禁用自动旋转或在移动设备上显示纵向模式？

问候

【问题讨论】：

【解决方案1】：

您可以尝试使用媒体查询来定位特定方向：

@media max-width(600px) and (orientation: landscape) {
    rules for landscaped devices...
}

【讨论】：

【解决方案2】：

将您的媒体查询更改为更高的值？

max-width(600px) {etc..}

【讨论】：

是的，我想过，但使用它我可以捕捉平板电脑等，你知道吗？
这确实是您唯一的选择。有数千种可能的设备尺寸，您必须在某处划清界限。例如，三星 Galaxy Note 3 手机在纵向模式下报告的宽度为 540 像素。现在，他们会看到您网站的桌面版本。