css3动画(图片翻转)

    xiaoxiao2021-04-14  67

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css">   div{   background-color: red;   width: 400px;   height: 200px;   background: url(1.jpg) center no-repeat;   -webkit-transform-style:preserve-3d;   -webkit-animation-name:x-spin;   -webkit-animation-duration:20s;   -webkit-animation-iteration-count:infinite;   -webkit-animation-timing-function:ease;   }   @-webkit-keyframes x-spin{   0%{   -webkit-transform:rotateX(0deg);   }   50%{   -webkit-transform:rotateX(180deg);     }   100%{   -webkit-transform:rotateX(360deg);     }   } </style> </head> <body> <div></div> </body> </html>
    转载请注明原文地址: https://ju.6miu.com/read-670026.html

    最新回复(0)