CSS Animation effect animation

/*CSS Document*/Body{margin:400px}Div{width:400px;Height:400px;Background-color:Yellow;Border:2px solid Red;font-size:50px;Animation-name:Sky;animation-duration:4s;animation-timing-function:ease-in;        
Animation-delay:0.5s;
    /*Delay Time*/   
Animation-iteration-count:2;
    /*number of cycles iteration repeated infinite indicates infinite number of cycles*/    
Animation-direction:Alternate;
    /*Slow -moving direction alternately play, speed → fast * Normal default value*/    
Animation-play-state:paused;
    /*to stop playing, to use the dynamic*/Animation-fill-mode:Backforwards;Animation-fill-mode:forwards;      
Animation-fill-mode:both;
    /*backforwards or forwards depending on the situation, need to be used in conjunction with iteration*/Animation:sky 1s ease 2 alternate 1s both;/*abbreviated name/number of seconds/ease/cycle count/easing direction/delay/end status*/}@keyframes Sky{

0%,100%{Background-color:Orange;margin:0px;Color:#99FF66;}10%{Background-color:#FF0000;margin:230px;}20%{Background-color:#00FF00;}30%{Background-color:#336600;}40%{Background-color:#66FFFF;margin:140px;}50%{Background-color:#FF6633;}60%{Background-color:#CCCC99;}70%{Background-color:#993366;}80%{Background-color:#996699;}90%{Background-color:#CC99FF;}

  form{background-color:Orange;           Margin:0px;           color:White;}             to {background-color:#FF0000;           Margin:200px;}            

}                    

CSS Animation effect animation