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

CSS calc() फ़ंक्शन का उपयोग

CSS calc() फ़ंक्शन का उपयोग करके प्रॉपर्टी मानों की गणना करें, जैसे चौड़ाई, ऊंचाई, मार्जिन आदि। यह विभिन्न इकाइयों को मिलाने की अनुमति देता है।

उदाहरण

<!DOCTYPE html> <html>    <head>       <style>          #demo {             position: absolute;             width: calc(100% - 100px);             background-color: blue;             text-align: center;          }       </style>    </head>    <body>       <h1>Heading One</h1>       <div id = "demo">This is it!</div>    </body> </html>

व्याख्या: width: calc(100% - 100px) एलिमेंट की चौड़ाई को पैरेंट की पूरी चौड़ाई से 100px कम सेट करता है, जो रिस्पॉन्सिव डिज़ाइन में उपयोगी है।

  1. - CSS में repeating-radial-gradient() फ़ंक्शन का उपयोग

    repeating-radial-gradient() फ़ंक्शन का उपयोग रेडियल ग्रेडिएंट को दोहराने के लिए किया जाता है। यह एक केंद्र बिंदु से बाहर की ओर दोहराता हुआ पैटर्न बनाता है। उदाहरण <!DOCTYPE html> <html> <head> <style> #demo { height: 300px; background: repeati

  1. CSS rotate() फ़ंक्शन CSS rotate() फ़ंक्शन

    CSS में rotate() फ़ंक्शन किसी तत्व को घुमाता है। पैरामीटर घुमाव के कोण को सेट करता है। मान डिग्री, रेडियन, ग्रेड, या टर्न में हो सकते हैं। उदाहरण <!DOCTYPE html> <html> <head> <style> #demo1 { background-color: hsla(140, 100%, 50%, 0.8); } #demo2 { backg

  1. CSS rgba() फ़ंक्शन CSS rgba() फ़ंक्शन

    rgba() लाल, हरे, नीले और अल्फा के लिए RGBA रंग मान परिभाषित करता है। अल्फा रंग की अपारदर्शिता है यानी 0.0 और 1.0 के बीच की संख्या। यहां, 1.0 पूर्ण अपारदर्शी के लिए होगा। उदाहरण <!DOCTYPE html> <html> <head> <style> #demo1 { background-color: hsla(140, 100%, 50%