Animated banner made by keyframes

Banner is changing background automatically. 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">

<style>
   div {
     text-align:center;
     padding:15px 0;
     -webkit-animation:banner_animation 12s infinite;
   }
   @-webkit-keyframes banner_animation
   {
     0% { background-color:white; }
     25% { background-color:yellow; }
     50% { background-color:gold; }
     75% { background-color:red; }
     100% { background-color:white; }
   }
</style>
</head>

<body>

	<div>Simple banner text</div>

</body>
</html>
List

Responses

0 Replies