Css:- The border shadow animation


The border shorthand property sets all the border properties in one declaration.
The box-shadow property attaches one or more shadows to an element.




<!DOCTYPE html> 
<html> 
 
<head> 
 <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
 <style> 
  #anim { 
   animation: animation_name 1s infinite; 
  } 
   
  @-webkit-keyframes animation_name { 
   from { 
    border: 1px solid green; 
   } 
   to { 
    border: 10px dotted red; 
   } 
  } 
   
  @keyframes animation_name { 
   from { 
    box-shadow: 0px 0px 0px #888888; 
   } 
   to { 
    box-shadow: 10px 10px 5px #888888; 
   } 
  } 
 </style> 
 
</head> 
 
<body> 
 <div id="anim"> 
  Border Shadow 
 </div> 
 
</body> 
 
</html>
Css:- The border shadow animation Css:-  The border shadow animation Reviewed by Network security on May 23, 2019 Rating: 5

No comments:

Useful Information

Powered by Blogger.