查找如何将页面旋转一定角度

在前端开发中，页面旋转有时可以起到一些特殊的效果，比如横屏展示。那么如何实现页面旋转呢？下面是几种常见的实现方案：

CSS3 transform

CSS3 transform 是一种基于 CSS 的旋转技术，可以用它来实现页面的旋转、缩放和平移等操作。具体实现方式如下：

/* 将页面顺时针旋转90度 */
body {
  transform: rotate(90deg);
}

此时页面就被旋转了90度，在实际应用中可以将旋转的角度按需更改。

JavaScript

通过 JavaScript 脚本也可以实现页面的旋转效果。示例代码如下：

// 将页面旋转90度
document.body.style.transform = 'rotate(90deg)';

上述代码使用了 DOM API 来获取页面的根节点，然后对其样式属性 transform 进行设置。

CSS transform + JavaScript

除了单独采用 CSS3 transform 或 JavaScript 实现页面旋转，还可以将两者结合起来。通过 JavaScript 控制 CSS3 transform 的样式属性，再实现页面的旋转效果。

/* 初始样式 */
body {
  transform: rotate(0deg);
}

/* 通过 JS 控制旋转 */
body.rotate {
  transform: rotate(90deg);
}

// 将页面旋转90度
document.body.classList.add('rotate');

上面的示例代码中，初始时 body 的样式属性 transform 被设置为 rotate(0deg)，当用户触发了旋转操作后，JS 通过添加 rotate 类来控制 transform 的样式属性，从而实现具体的旋转效果。

以上是几种实现页面旋转的方案，可以根据具体需求来选择不同的方案。