<!--create a web page to apply animation to image tag by using css Animation-->
<!DOCTYPE html>
<html>
<head>
<style>
#x
{
border:2px solid green;
background-color:green;
color:white;
text-align:center;
width-left:400px;
padding:10px;
border-top-left-radius:20px;
border-bottom-right-radius:20px;
}
h2
{
color:blue;
text-shadow:0px 0px 5px green;
}
@keyframes Animation1
{
from {width:100px;height:60px;transform:rotate(0deg);}
to {width:600px;height:400px;transform:rotate(360deg);}
}
#img1
{
width:100px;
height:60px;
border:0px solid blue;
border-radius:10px;
padding:5px;
margin-left:50px;
Animation-name:Animation1;
Animation-duration:20s;
Animation-iteration-count:5;
Animation-direction:alternate;
Animation-delay:4s;
}
</style>
</head>
<body bgcolor="orange">
<h1 id="x">PAVAN KALYAN</h1>
<marquee><h2>HAPPY BIRTHDAY PSPK PAVANISM</h2></marquee>
<br></br>
<img id="img1" src="pspk.jpg"/>
<img id="img1" src="pk.jpg"/>
</body>
</html>
