Javascript React-CSS转换就像一个书页

在学习React和Front Web Dev的过程中，我会深入研究更高级的主题

我了解了使用“离开/进入”的ReactCSTranslationGroup。。等等，但它似乎不再维护，我们现在必须使用CSSTransitionGroup

我做了一个小项目来尝试新东西。我能够在两页之间进行幻灯片转换

但现在，我想通过对实际页面进行变形并发现下一个页面，来进行类似于书本页面的转换，从而使事情变得更加有趣

我正在四处寻找，但还没有找到解决办法。我也开始阅读关于WebGL或简单的CSS3转换的文章，但是我完全迷路了

---

有人能不能，不仅给我一个片段，还要向我解释一下这种转换的方法？

一旦你掌握了CSS转换的窍门，它就非常容易了

#myPage {
   transition: all .5s;
}

这一点css会说，如果我的myPage div上有任何样式的更改，让我们花0.5秒来完成。需要注意的是，它只适用于可数属性值。所以display:none->display:block不会使用过渡效果。你必须改变高度/宽度

#myPage {
    transition: width 2s, height 4s;
}

也可以通过在转换特性之后命名特性来直接将其作为目标

此外，您可以使用css中的transform属性来操作三维元素

#myPage{
    transition: transform 1s;
}
#myPage:hover{
    transform: rotateX(150deg);
    transform: rotateY(150deg);
    transform: rotateZ(150deg);
}

---

希望这能帮助你开始

谢谢你，我会挖这个的。我知道如何让一个网络应用前后兼容。。。但我不知道如何让它变得漂亮。我的意思是思考并做好UI和UX方面的工作；