CSS margin-top प्रॉपर्टी पर एनिमेशन करें

CSS में margin-top प्रॉपर्टी पर एनिमेशन लागू करने का तरीका यहां दिखाया गया है।

उदाहरण

<!DOCTYPE html> <html> 
  <head> 
    <style> 
      div { 
        background-color: orange; 
        animation: myanim 4s infinite; 
        color: white; 
      } 
      @keyframes myanim { 
        30% { 
          margin-top: 30px; 
        } 
      } 
    </style> 
  </head> 
  <body> 
    <h2>हेडिंग वन</h2> 
    <div>यह डेमो टेक्स्ट है।</div> 
  </body> 
</html>

व्याख्या: डिव का प्रारंभिक कोई ऊपरी मार्जिन नहीं है। एनिमेशन के 30% पर margin-top: 30px हो जाता है, जिससे तत्व नीचे खिसक जाता है। एनिमेशन 4 सेकंड में अनंत बार चलता है।