Question

我们的网站上有一个移动网页，需要在加载时始终在浏览器中以横向呈现。此外，页面需要以横向锁定，以便设备无法更改方向。

主流移动浏览器或CSS属性中是否有任何JS API可以实现此目的？

Answer 1

您可以尝试使用此代码：

#container { display:block; }

@media only screen and (orientation:portrait){

  #container {

   height: 100vw;

   -webkit-transform: rotate(90deg);

   -moz-transform: rotate(90deg);

   -o-transform: rotate(90deg);

   -ms-transform: rotate(90deg);

   transform: rotate(90deg);

  }

}

@media only screen and (orientation:landscape){

  #container {

  -webkit-transform: rotate(0deg);

  -moz-transform: rotate(0deg);

  -o-transform: rotate(0deg);

  -ms-transform: rotate(0deg);

  transform: rotate(0deg);

   }

您还应该将其添加到body标签：

 <BODY id="container">

我找到了这个解决方案here。相同的博客也提供了额外的建议，但我没有尝试过，因为上面的一个很好用

如何强制移动网页加载横向

1 个答案: