Javascript 旋转一捆绝对定位的div-，而不将其放入容器中

我尝试旋转div，但每个div都是单独旋转的，我希望将它们作为一个团队进行旋转

我如何旋转div使其保持对齐？就像一开始那样

到目前为止，我已经做到了这一点，但每张卡片的高度都是一样的

函数旋转体{ $.card.addClassrotateme； } .卡片{ 位置：绝对位置； 宽度：45px； 高度：70像素； 顶部：120px； 背景：fff； -网络工具包盒阴影：3px3px7pxRGBA0,0,0.3； 盒影：3px3px7pxRGBA0,0,0.3； 边框：纯黑； } card0{ 左：104； } 卡片1{ 左：124px； } 卡片2{ 左：144px； } 卡片3{ 左：164px； } 旋转体{ 变换：旋转20度； } 按我

---

将它们包裹在另一个div中，并按如下方式旋转：

函数旋转体{ $.cards.addClassrotateme； } .卡片{ 位置：绝对位置； 宽度：45px； 高度：70像素； 顶部：120px； 背景：fff； -网络工具包盒阴影：3px3px7pxRGBA0,0,0.3； 盒影：3px3px7pxRGBA0,0,0.3； 边框：纯黑； } card0{ 左：104； } 卡片1{ 左：124px； } 卡片2{ 左：144px； } 卡片3{ 左：164px； } 旋转体{ 变换：旋转20度； } 按我

---

您可以将所有卡片放入一个容器中并旋转容器，或者您可以计算每个卡片在文档中的同一点上的变换原点。最后，我该如何做？放入容器是不可能的！如果旋转，它们如何保持在同一位置？在您的代码片段中，它们跳转到左边，您需要在cards容器上设置并尝试使用这些值