html 让图片自动转动,css3,肿么让图片自动动起来?

下面是一个例子，具体的需要你自己慢慢学习。

!DOCTYPE htmlhtmlheadstyle div{width:100px;height:100px;background:red;position:relative;animation:myfirst 5s linear 2s infinite alternate;/* Firefox: */-moz-animation:myfirst 5s linear 2s infinite alternate;/* Safari and Chrome: */-webkit-animation:myfirst 5s linear 2s infinite alternate;/* Opera: */-o-animation:myfirst 5s linear 2s infinite alternate;}@keyframes myfirst{0% {background:red; left:0px; top:0px;}25% {background:yellow; left:200px; top:0px;}50% {background:blue; left:200px; top:200px;}75% {background:green; left:0px; top:200px;}100% {background:red; left:0px; top:0px;}}@-moz-keyframes myfirst /* Firefox */{0% {background:red; left:0px; top:0px;}25% {background:yellow; left:200px; top:0px;}50% {background:blue; left:200px; top:200px;}75% {background:green; left:0px; top:200px;}100% {background:red; left:0px; top:0px;}}@-webkit-keyframes myfirst /* Safari and Chrome */{0% {background:red; left:0px; top:0px;}25% {background:yellow; left:200px; top:0px;}50% {background:blue; left:200px; top:200px;}75% {background:green; left:0px; top:200px;}100% {background:red; left:0px; top:0px;}}@-o-keyframes myfirst /* Opera */{0% {background:red; left:0px; top:0px;}25% {background:yellow; left:200px; top:0px;}50% {background:blue; left:200px; top:200px;}75% {background:green; left:0px; top:200px;}100% {background:red; left:0px; top:0px;}}/style/headbodyp本例在 Internet Explorer 中无效。/pdiv/div/body/html

取消

评论