CSS强制横屏写法前言最近遇到app的一个弹框需要横屏，app已经限制不能横屏；只能css强制横屏；搜索了一下，可以通

前言

最近遇到app的一个弹框需要横屏，app已经限制不能横屏；只能css强制横屏；搜索了一下，可以通过css的旋转页面来强制横屏，但是有个问题就是如果用了第三方插件的话，那touch的手势方向暂时没想到方法解决

需要旋转页面添加以下样式

body {
  width: 100vh;
  height: 100vw;
  transform-origin: top left;
  transform: rotate(90deg) translateY(-100%);
}

将整个页面旋转90度，并使其适应横屏显示。其中，width: 100vh和height: 100vw用于设置页面宽度和高度，使其与视口的宽高比相反；transform-origin: top left用于指定旋转中心点的位置；transform: rotate(90deg) translateY(-100%)用于旋转页面并将其移动到视口顶部左侧。