सीएसएस गणित कार्य
CSS गणित फ़ंक्शन गणितीय अभिव्यक्तियों को गुण मानों के रूप में उपयोग करने की अनुमति देते हैं। यहां, हम calc(),
max()और min()कार्यों की व्याख्या करेंगे।
कैल्क () फ़ंक्शन
calc()फ़ंक्शन संपत्ति मान के रूप में उपयोग करने के लिए गणना करता है ।
सीएसएस सिंटेक्स
calc(expression)
| Value | Description |
|---|---|
| expression | Required. A mathematical expression. The result will be used as the value. The following operators can be used: + - * / |
आइए एक उदाहरण देखें:
उदाहरण
<div> तत्व की चौड़ाई की गणना करने के लिए कैल्क () का उपयोग करें:
#div1 {
position: absolute;
left: 50px;
width: calc(100% - 100px);
border: 1px solid black;
background-color: yellow;
padding: 5px;
}
अधिकतम () फ़ंक्शन
max()फ़ंक्शन, अल्पविराम से अलग किए गए मानों की सूची से, संपत्ति मान के रूप में सबसे बड़े मान का उपयोग करता है ।
सीएसएस सिंटेक्स
max(value1, value2, ...)
| Value | Description |
|---|---|
| value1, value2, ... | Required. A list of comma-separated values - where the largest value is chosen |
आइए एक उदाहरण देखें:
उदाहरण
#div1 की चौड़ाई जो भी सबसे बड़ा हो, 50% या 300px पर सेट करने के लिए max() का उपयोग करें:
#div1 {
background-color: yellow;
height: 100px;
width: max(50%, 300px);
}
न्यूनतम () फ़ंक्शन
min()फ़ंक्शन, अल्पविराम से अलग किए गए मानों की सूची से, संपत्ति मान के रूप में, सबसे छोटे मान का उपयोग करता है ।
सीएसएस सिंटेक्स
min(value1, value2, ...)
| Value | Description |
|---|---|
| value1, value2, ... | Required. A list of comma-separated values - where the smallest value is chosen |
आइए एक उदाहरण देखें:
उदाहरण
#div1 की चौड़ाई जो भी सबसे छोटा हो, 50% या 300px पर सेट करने के लिए min() का उपयोग करें:
#div1 {
background-color: yellow;
height: 100px;
width: min(50%, 300px);
}
सभी सीएसएस गणित कार्य
| Function | Description |
|---|---|
| calc() | Allows you to perform calculations to determine CSS property values |
| max() | Uses the largest value, from a comma-separated list of values, as the property value |
| min() | Uses the smallest value, from a comma-separated list of values, as the property value |