How to add animation in CSS(animation-name, animation-delay, animation-iteration-count, animation-direction,@keyframes)

 In CSS Programming language you can easily use animation just by follow pictures and codes given below. Here you will learn how to add animation in CSS

Here you will learn about

  • @keyframes
  • animation-delay
  • animation-iteration-count
  • animation-name
  • animation-direction.   

How-to-add-animation-in-CSS(animation-name, animation-delay, animation-iteration-count, animation-direction,@keyframes)
Lets start

1. @keyframes


In @keyframes you have to write the name of animation-name. 
 For example: If we use Vikash as animation-name  then we will use it in front of @keyframes eg. @keyframes Vikash.

Here is the use of @keyframes, animation-name, animation-iteration-count and animation-delay.


How-to-add-animation-in-CSS(animation-name, animation-delay, animation-iteration-count, animation-direction,@keyframes)
how to add animation in CSS


2. animation-delay

By using animation-delay we are able to delay the time of animation.

3. animation-iteration-count

By using this we can fix the repeatition of animation. We can also set this as infinite.

If you know how to make a website then you can provide services on freelancing sites.


4. animation-name

We have to use this to use @keyframes as we already discuss in first point.

5. animation-direction

By using this we can fix the direction of our animation.

How-to-add-animation-in-CSS(animation-name, animation-delay, animation-iteration-count, animation-direction,@keyframes)

Now you know the basics of animation in CSS. Hope you now know 
how to add animation in CSS

Check out this : animation expert.

If you have any doubts you can ask me by comment below or by email us.

Thanks for reading.

Post a Comment

0 Comments