There is a round bitmap.
& lt; img src = "http://photoholic24.com/wp-content/uploads /2012/01/smile_b.jpg "width =" 100 "height =" 100 "/ & gt; Answer 1, authority 100%
img.rot {
animation: 1s linear 0s normal none infinite running rot;
-webkit-animation: 1s linear 0s normal none infinite running rot;
width: 100px;
}
@keyframes rot {
0% {
transform: rotate (0deg);
}
100% {
transform: rotate (360deg);
}
}
@ -webkit-keyframes rot {
0% {
transform: rotate (0deg);
}
100% {
transform: rotate (360deg);
}
} & lt; img class = "rot" src = "https: //cdn.iconscout. com / icon / free / png-256 / grinning-face-smile-emoji-happy-37705.png "& gt; Answer 2, authority 29%
You can use the property animation
To which you can set the animation described in @keyframes , and also animation settings: lengthy one iteration, delay before starting, number of repetitions, etc.
@ keyframes spin {
from {transform: rotate (0deg);}
to {transform: rotate (360deg);}
}
img {
animation: spin 5s linear 0s infinite;
} & lt; img src = "http://photoholic24.com/wp-content/uploads /2012/01/smile_b.jpg "width =" 100 "height =" 100 "/ & gt; Answer 3, authority 14%
Rotation animation on hover
img {
border-radius: 50%;
-webkit-transition: -webkit-transform .8s ease-in-out;
transition: transform .8s ease-in-out;
}
img: hover {
-webkit-transform: rotate (360deg);
transform: rotate (360deg);
} & lt; img src = "http://i.imgur.com/3DWAbmN.jpg "/ & gt; Programmers, Start Your Engines!
Why spend time searching for the correct question and then entering your answer when you can find it in a second? That's what CompuTicket is all about! Here you'll find thousands of questions and answers from hundreds of computer languages.