zoukankan      html  css  js  c++  java
  • css3 div实现三维立体圆环旋转效果

    圆环最好设计为扫描特效,转起来会很有感觉

    1、首先创建一个div

    <div class="companydiV">
                <img class="imgcompany" src="../../static/img/centerroll.png" alt="">
     </div>

    2、css样式

    .companydiV{
        position: absolute;
        top: -130px;
        /* left: 80px; */
        transform: skewY(0) rotateZ(88deg) rotateX(8deg) rotateY(-79deg);
      }

    3、css3动画

    @keyframes rollImg {
        0% {
          transform :rotateZ(5deg);
        }
        100% {
          transform :rotateZ(1000deg);
        }
      }
      .imgcompany{
        /* transform: rotate(25deg); */
        animation:2s rollImg linear infinite normal;
        transform: skewX(-45deg);
      }

  • 相关阅读:
    javaMap
    javaCollections
    java线程
    mysql插入,删除
    mysql基础(1)
    javaSet,Date
    中青杯数学建模大赛
    javaJDBC
    中秋记事~~项目开发
    太高兴了,今天有人送我吃月饼!
  • 原文地址:https://www.cnblogs.com/tiepeng/p/11476969.html
Copyright © 2011-2022 走看看