Animation

    0

    0

    In this code, the div has an animation-name and animation-duration set. The animation-name is "example" and the animation-duration is four seconds.

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    div {
      width: 100px;
      height: 100px;
      background-color: red;
      animation-name: example;
      animation-duration: 4s;
    }
    
    @keyframes example {
      from {background-color: red;}
      to {background-color: yellow;}
    }
    </style>
    </head>
    <body>
    
    <h1>CSS Animation</h1>
    
    <div></div>
    
    <p><b>Note:</b> When an animation is finished, it goes back to its original style.</p>
    
    </body>
    </html>
    
    Codiga Logo
    Codiga Hub
    • Rulesets
    • Playground
    • Snippets
    • Cookbooks
    soc-2 icon

    We are SOC-2 Compliance Certified

    G2 high performer medal

    Codiga – All rights reserved 2022.