绕X轴动弹，正常来说是需要3D结果才可以实现的，那么我们在网页平面上怎么实现这个结果呢？
工具/原料
- 电脑
- Sublime
方式/步骤
- 1
首先介绍一下小编的页面架构，div——stage（舞台），div——container（容器），和一个 img （就是兔子图片）
- 2
先设置一下舞台的样式，宽度 500px ；高度 324px； 设置一个红色的边框，作为后面 图片动弹时的对比；（其它的 图片中有注释）
- 3
容器（container）div，是节制图片的关头，图片在容器中，容器变更，图片天然也跟着变更；然后设置 过渡结果 （transition）实现动态的过程；设置完当作今后初步结果如图二，只不外无法动弹；
- 4
想要实现动弹，还要设置一下 ：hover 这个选择器 ，给 容器添加一个转变，即一个扭转的转变，用transform 属性节制；代码如图
- 5
下图是小编本身页面的整个代码图，供大师参考；（有些不关头的属性可以自由设置的，好比图片，宽度，高度等等）
注重事项
- 小我进修经验，仅作分享
- 注重浏览器的兼容性