## css ~~~ #out{ widows: 100px; height: 100px; background: black; transition: all 1s; } #out:hover{ animation:dong 1s ease-in-out 0s 1 normal; -moz-animation:dong 1s ease-in-out 0s 1 normal; -webkit-animation:dong 1s ease-in-out 0s 1 normal; -o-animation:dong 1s ease-in-out 0s 1 normal; } @keyframes dong{ 0%{ transform: rotate(20deg); } 30%{ transform: rotate(-20deg) } 70%{ transform: rotate(20deg) } 100%{ transform: rotate(-20deg) } } ~~~ * * * * * ## html ~~~ <div id="out"> </div> ~~~