移动端页面通过前端方法禁止ios页面横屏？

Question

移动端页面样式如果是横屏时就乱了，如何通过前端的方法禁止ios横屏呢？

Answer 1

@media all and (orientation : landscape) { 

/*横屏时代码*/

} 

@media all and (orientation : portrait){ 

/*竖屏时代码*/

} 

你可以通过css来判断，当横屏时，弹出相应提示。

类似这样的效果

Answer 2

以下没有实验过

<!-- UC强制竖屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC强制全屏 -->
<meta name="full-screen" content="yes">
<!-- QQ强制全屏 -->
<meta name="x5-fullscreen" content="true">
<!-- UC应用模式 -->
<meta name="browsermode" content="application">
<!-- QQ应用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 点击无高光 -->
<meta name="msapplication-tap-highlight" content="no">
<!-- 适应移动端 END -->

Answer 3

1L回答 比较简单实用

Answer 4

参见 ： http://ad.weixin.qq.com/learn...
横屏提示