当前位置:   article > 正文

vue使用css3实现无限旋转动画——面试_vue使用css3加js使 3d旋转动画 围绕旋转 根据请求后台的数据动态渲染

vue使用css3加js使 3d旋转动画 围绕旋转 根据请求后台的数据动态渲染
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title></title>
  5. <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  6. <style type="text/css">
  7. /*无限旋转动画*/
  8. @keyframes changDeg{
  9. 0%{
  10. transform: rotate(0deg);
  11. }
  12. 100%{
  13. transform: rotate(360deg);
  14. }
  15. }
  16. #app{
  17. width:500px;
  18. height: 500px;
  19. margin:50px auto;
  20. /*transform: rotate(0deg);*/
  21. background-color:red;
  22. animation:changDeg 2s linear 0.2s infinite;
  23. }
  24. </style>
  25. </head>
  26. <body>
  27. <!-- <div></div> -->
  28. <div id="app"></div>
  29. <script type="text/javascript">
  30. var app = new Vue({
  31. el:'#app'
  32. });
  33. </script>
  34. </body>
  35. </html>

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/你好赵伟/article/detail/325780
推荐阅读
相关标签
  

闽ICP备14008679号