css3旋转动画90度

CSS3旋转动画可以使网页元素沿着某一方向旋转一定角度，增加网页的生动感和视觉效果。下面介绍如何使用CSS3实现一个旋转90度的动画效果。

.rotate90{
    -webkit-transform: rotate(90deg);
     -moz-transform: rotate(90deg);
       -o-transform: rotate(90deg);
         transform: rotate(90deg);
        }

以上代码使用了CSS3的transform属性，其中rotate表示旋转，90deg表示旋转90度，-webkit-transform,-moz-transform,-o-transform是不同浏览器私有的前缀，以保证兼容性。

接下来给一个简单的例子：

旋转动画.rotate90{
    -webkit-transform: rotate(90deg);
     -moz-transform: rotate(90deg);
       -o-transform: rotate(90deg);
         transform: rotate(90deg);
        }
    CSS3旋转动画

在以上代码中，我们给一个div加上class="rotate90"，就可以达到旋转90度的动画效果了。

总之，CSS3旋转动画的实现方法很简单，只需要使用transform属性的rotate子属性即可，切记对不同浏览器加上相应前缀，以保证兼容性，这样就可以轻松地让网页元素旋转动起来了。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！