CSS animation

CSS animation

CSS Animation

Animation in CSS we can used to animate any thing like images, box or text with the help of animation properties.

Animation properties are :-

1. animation-name :- abc

2. animation-duration:- 2s;

3. animation-timimg-function:ease;

4. animation-delay:0s;

5. animation-iteration-count:1;

6. animation-direction:normal;

7. animation-fill-mode:none;

8. animation-play-state:running;

Let's have an example:-

<!DOCTYPE html>

<html>

<head>

<style>

.a {

width: 100px;

height: 100px;

background-color: red;

animation-name: testing;

animation-duration: 4s;

}

@keyframes testing

{

from {background-color: orange;}

to {background-color: green;}

}

</style>

</head>

<body>

</body>

</html>

Web Design Tips