सबसे ज़्यादा काम करने वाले CSS फ़ंक्शन, काम के हिसाब से समूहों में: आकार की गणना करना, कस्टम प्रॉपर्टी पढ़ना, रंग मिलाना और चुनना, ग्रेडिएंट बनाना, फ़िल्टर लगाना, आकृतियाँ बनाना, बॉक्स बदलना, और लॉजिक से मान चुनना। हर पंक्ति में फ़ंक्शन के साथ एक-पंक्ति का उदाहरण दिया गया है।
CSS फ़ंक्शन आर्ग्युमेंट लेता है और एक मान लौटाता है जिसे ब्राउज़र उपयोग करता है। सबसे उपयोगी हैं: गणित के लिए calc(), डिज़ाइन टोकन के लिए var(), फ़्लूइड साइज़िंग के लिए clamp(), और व्युत्पन्न रंगों के लिए color-mix()। इन्हें स्वतंत्र रूप से नेस्ट करें: clamp(1rem, var(--fluid), 3rem) एक ही रिस्पॉन्सिव मान है।
संदर्भ तालिका · 62 प्रविष्टियाँ
CSS फ़ंक्शनExplained
62 of 62 rows
साइज़िंग और गणित
मिश्रित यूनिट्स के साथ अंकगणितीय व्यंजक का परिणाम।
width: calc(100% - 2rem);
दिए गए मानों में सबसे छोटा।
width: min(100%, 60ch);
दिए गए मानों में सबसे बड़ा।
width: max(320px, 40vw);
न्यूनतम, पसंदीदा और अधिकतम के बीच सीमित एक मान।
font-size: clamp(1rem, 2vw, 1.5rem);
यूज़र एजेंट द्वारा दिए गए एनवायरनमेंट वेरिएबल को पढ़ता है।
padding: env(safe-area-inset-top);
कंटेंट की आंतरिक चौड़ाई तक सीमित एक आकार।
width: fit-content(200px);
एक मान को दूसरे मान के निकटतम गुणज तक पूर्ण करता है।
width: round(up, 133px, 50px);
भाग का धनात्मक शेषफल, हमेशा गैर-ऋणात्मक।
margin: mod(100px, 30px);
भाग का शेषफल, भाज्य का चिह्न बनाए रखता है।
margin: rem(-100px, 30px);
निरपेक्ष मान।
translateX(abs(-10px));
-1, 0 या 1, मान के चिह्न के अनुसार।
padding: sign(-5px) * 10px;
ग्रिड
ग्रिड ट्रैक के लिए आकार सीमा, न्यूनतम और अधिकतम के बीच।