Saturday, October 9, 2021

CSS Animation box

 CSS Animation box  Code

<!DOCTYPE html>>

<html>


<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" type="text/css" href="nav.css">

    <title>CSS Animation</title>

</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>


CSS Animation box Style code

div{

    width:100px;

    height:100px;

    background-color: red;

    animation-name:box;

    animation-duration:4s;

}

@keyframe box{

    form{background-color: red;}

    to{background-color:yellow;}


}

No comments:

Post a Comment

JavaScript Animated

  JavaScript Animated <!DOCTYPE html> <html> <style> #myContainer {   width: 400px;   height: 400px;   position: relative;...