为移动设备禁用横向模式 [英] Disable landscape-mode for mobile devices

问题描述

你好我在这里创建了一个响应式移动网站：

  max-width（480px）{etc ..} 
 
 + 
 
   

对于每个移动设备，网站看起来都是相同的=>很棒。

但是当我改变为风景时，有超过480像素和桌面的网站变化显示。

是否有任何可能禁用自动旋转或在移动设备上显示肖像模式（即使超过480像素）？

问候

解决方案

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

  @媒体最大宽度（600像素）和（方向：风景）{
园林设备规则... 
} 
  

有关媒体查询的更多信息：

https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Media_queries

Hi there i created a responsive mobile website using this:

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

+

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

For every mobile device the website looks the same => great.

But when i change to landscape there is more than 480px and the website-variation of the desktop displays.

Is there any possibility to disable the auto-rotate or to show the portrait-mode on mobile-device even if there is more than 480px?

Greetings

解决方案

You can try and target specific orientation with your media query:

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

More on media queries:

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

这篇关于为移动设备禁用横向模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！