uniapp如何使背景框旋转而中间的div而不会旋转

可以使用CSS的transform属性来实现背景框旋转而中间的div不旋转的效果。具体实现步骤如下：

1. 给背景框添加一个class，比如.rotate，用于控制旋转效果。

2. 设置背景框的position为absolute，让它脱离文档流，不影响其他元素的布局。

3. 设置背景框的宽度、高度、背景颜色等样式。

4. 给中间的div设置一个父元素，并设置该父元素的position为relative，让它成为中间div的参考坐标系。

5. 设置中间的div的position为absolute，让它脱离文档流，不影响其他元素的布局。

6. 设置中间的div的left和top属性，使其相对于父元素垂直居中。

7. 在.rotate类中设置transform-origin属性，将旋转中心设置为背景框的中心。

8. 在.rotate类中设置transform属性，通过rotate()函数实现旋转。

示例代码如下：

HTML部分：

<div class="container">
  <div class="bg rotate"></div>
  <div class="content">中间的div</div>
</div>

CSS部分：

.container {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 100px auto;
}

.bg {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #f00;
}

.content {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.rotate {
  transform-origin: center center;
  transform: rotate(45deg);
}