Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> CSS

CSS animation-iteration-count प्रॉपर्टी


CSS के साथ एनिमेशन कितनी बार खेली जानी चाहिए, यह सेट करने के लिए animation-iteration-count प्रॉपर्टी का उपयोग करें।

animation-iteration-count प्रॉपर्टी लागू करने के लिए निम्न कोड चलाकर देखें:

उदाहरण

<!DOCTYPE html> <html>    <head>       <style>          div {             width: 150px;             height: 200px;             position: relative;             background-color: yellow;             animation-name: myanim;             animation-duration: 2s;             animation-direction: alternate-reverse;             animation-iteration-count: 3;          }          @keyframes myanim {             from {left: 100px;}             to {left: 200px;}          }          #demo1 {animation-timing-function: ease;}          #demo2 {animation-timing-function: ease-in;}       </style>    </head>    <body>       <div id = "demo1">ease effect</div>       <div id = "demo2">ease-in effect</div>    </body> </html>

  1. - CSS white-space प्रॉपर्टी

    white-space प्रॉपर्टी का उपयोग किसी तत्व के अंदर व्हाइट स्पेस (स्पेस, टैब, लाइन ब्रेक) को कैसे संभाला जाए, इसे नियंत्रित करने के लिए किया जाता है। उदाहरण <!DOCTYPE html> <html> <head> <style> p.demo1 { white-space: normal; } p.demo2 {

  1. CSS में writing-mode प्रॉपर्टी CSS में writing-mode प्रॉपर्टी

    writing-mode प्रॉपर्टी का उपयोग यह सेट करने के लिए किया जाता है कि टेक्स्ट की लाइनें क्षैतिज या लंबवत रूप से रखी गई हैं। प्रॉपर्टी मान writing-mode: horizontal-tb | vertical-rl | vertical-lr; उदाहरण <!DOCTYPE html> <html> <head> <style> p { writing-mode: vertic

  1. CSS pointer-events प्रॉपर्टी CSS pointer-events प्रॉपर्टी

    pointer-events प्रॉपर्टी तय करती है कि तत्व पॉइंटर इवेंट (क्लिक, होवर, टच) पर प्रतिक्रिया देगा या नहीं। none से तत्व क्लिक-थ्रू हो जाता है, auto डिफ़ॉल्ट व्यवहार है। उदाहरण <!DOCTYPE html> <html> <head> <style> body { font-family: Segoe UI, Tahoma, Geneva, Verdana, sa