zoukankan      html  css  js  c++  java
  • CSS3学习 动画之rotate3d,很炫酷

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
    @-webkit-keyframes lll {
    0%{
    -webkit-transform: rotate3d(180,180,180,90deg);
    -moz-transform: rotate3d(180,180,180,90deg);
    -o-transform: rotate3d(180,180,180,90deg);
    }
    100%{
    -webkit-transform: rotate3d(80,80,80,135deg);
    -moz-transform: rotate3d(80,80,80,135deg);
    -o-transform: rotate3d(80,80,80,135deg);
    }
    }
    #hello{
    300px;
    height: 400px;
    background-color: #646464;
    -webkit-transition: all 3s linear;
    -moz-transition: all 3s linear;
    -o-transition: all 3s linear;
    }
    #hello{
    -webkit-animation-name:lll;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    background-color: green;
    }
    </style>
    </head>
    <body>
    <div id="hello"></div>

    记得兼容性问题
    </body>
    </html>

  • 相关阅读:
    时间工时累加
    python读取mnist
    开始学习haskell
    pip升级所有packages
    ImportError: numpy.core.multiarray failed to import
    NumPy for MATLAB users
    Spyder
    初学ObjectiveC
    Matlab闭包
    ObjeciveC 内存管理
  • 原文地址:https://www.cnblogs.com/hello-dummy/p/9059314.html
Copyright © 2011-2022 走看看