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

CSS3 के संक्रमण प्रभाव कैसे बनाएं?

<घंटा/>

CSS3 के संक्रमण प्रभाव बनाने के लिए, संक्रमण संपत्ति का उपयोग करें। CSS3 का उपयोग करके संक्रमण प्रभाव बनाने के लिए कोड निम्नलिखित है -

उदाहरण

<!DOCTYPE html>
<html>
<head>
<style>
.container div {
   width: 300px;
   height: 100px;
   background: rgb(25, 0, 255);
   border: 2px solid red;
   transition: width 2s;
}
.container:hover div {
   width: 100px;
}
</style>
</head>
<body>
<h1>Transition effects example</h1>
<div class="container">
<div></div>
</div>
<h2>Hover over the above div to reduce its width</h2>
</body>
</html>

आउटपुट

उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा -

CSS3 के संक्रमण प्रभाव कैसे बनाएं?


डिव के ऊपर मँडराने पर -

CSS3 के संक्रमण प्रभाव कैसे बनाएं?


  1. CSS के साथ चेकमार्क / टिक कैसे बनाएं

    हम CSS का उपयोग करके एक अनुकूलित चेकमार्क बना सकते हैं। निम्नलिखित उदाहरण इस प्रभाव को स्पष्ट करते हैं - उदाहरण <!DOCTYPE html> <html> <style> div {    margin: 2%;    position: relative;    width: 40px;    height: 40px;    box-shado

  1. PowerPoint में संक्रमण में ध्वनि प्रभाव कैसे जोड़ें

    क्या आपके पास एक PowerPoint प्रस्तुति है जिसे आप प्रस्तुत करना चाहते हैं, लेकिन आप अपनी प्रस्तुति में अपने संक्रमण में कुछ शांत ध्वनि प्रभाव जोड़ना चाहते हैं? इस ट्यूटोरियल में, हम बताएंगे कि PowerPoint में ट्रांज़िशन में ध्वनि प्रभाव कैसे जोड़ें। PowerPoint में ट्रांज़िशन क्या है? ट्रांज़िशन वे दृ

  1. ऐप्पल आईडी कैसे बनाएं

    आप Apple ID के बिना Apple उत्पादों और सेवाओं की दुनिया में बहुत दूर नहीं जा सकते। खुशी की बात है कि इसे सेट अप करना अविश्वसनीय रूप से आसान है। इस लेख में हम दिखाते हैं कि अपने या बच्चे के लिए Apple ID कैसे बनाया जाए, साथ ही मजबूत सुरक्षा कैसे स्थापित की जाए और पारिवारिक साझाकरण समूह कैसे शुरू किया ज