Computer >> Computer tutorials >  >> Programming >> CSS

CSS Animation Shorthand property


The shorthand property to set all the animation properties is animation. It sets the animation duration, animation name, etc.

You can try to run the following code to learn how to work with Animation Shorthand property:

Example

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            width: 150px;
            height: 200px;
            background-color: yellow;
            animation: myanim 2s
         }
         @keyframes myanim {
            from {
               background-color: green;
            }
            to {
               background-color: blue;
            }
         }
      </style>
   </head>
   <body>
      <div></div>
   </body>
</html>