CSS color() फ़ंक्शन
- पिछला पन्ना CSS clamp() फ़ंक्शन
- अगला पन्ना CSS color-mix() फ़ंक्शन
- एक स्तर ऊपर CSS फ़ंक्शन रेफरेंस मैनुअल
परिभाषा और उपयोग
CSS का color() फ़ंक्शन विशेष रंग अर्थात्मक में रंग को निर्दिष्ट करने की अनुमति देता है।
उदाहरण
उदाहरण 1
display-p3 रंग अर्थात्मक में पृष्ठभूमि रंग (अर्थात्मकता 0.3) निर्दिष्ट करें:
div {
padding: 15px;
border: 2px solid black;
background-color: color(display-p3 0.6 0.6 0 / .3);
}
उदाहरण 2
सापेक्षिक वाक्यविन्यास भाषा का इस्तेमाल करें:
div {
padding: 15px;
border: 2px solid black;
background-color: color(from blue srgb r g b / 0.4);
}
CSS भाषा
सापेक्षिक वाक्यविन्यास भाषा
color(colorspace c1 c2 c3 / A)
| मान | वर्णन |
|---|---|
| colorspace |
आवश्यक। निर्दिष्ट पूर्वनिर्धारित रंग अर्थात्मक को परिभाषित करता है:
|
| c1 c2 c3 |
आवश्यक। रंग के अर्थात्मक जगह के मान को प्रदर्शित करता है। हर एक मान को नंबर (0 से 1 तक), प्रतिशत (0% से 100% तक) या none (अर्थात् नष्ट) एक शब्द के रूप में लिखा जा सकता है। |
| / A |
वैकल्पिक। रंग के अर्थात्मक गुणा को प्रदर्शित करता है (0 पूरी तरह से पारदर्शी, 100 पूरी तरह से अन्यायमान है)। इसके साथ-साथ none (अर्थात् अन्यायमान गुणा) का इस्तेमाल भी किया जा सकता है। मूलभूत मान 100 है। |
सापेक्षिक वाक्यविन्यास भाषा
color(from color colorspace c1 c2 c3 / A)
| मान | वर्णन |
|---|---|
| from color |
शब्दांतरण से शुरू होता है, इसके बाद अर्थात्मक रंग के मान को प्रदर्शित करता है। यह अनुपाती रंग के आधार रंग है। |
| colorspace |
आवश्यक। निर्दिष्ट पूर्वनिर्धारित रंग अर्थात्मक को परिभाषित करता है:
|
| c1 c2 c3 |
आवश्यक। रंग के अर्थात्मक जगह के मान को प्रदर्शित करता है। हर एक मान को नंबर (0 से 1 तक), प्रतिशत (0% से 100% तक) या none (अर्थात् नष्ट) एक शब्द के रूप में लिखा जा सकता है। |
| / A |
वैकल्पिक। रंग के अर्थात्मक गुणा को प्रदर्शित करता है (0 पूरी तरह से पारदर्शी, 100 पूरी तरह से अन्यायमान है)। इसके साथ-साथ none (अर्थात् अन्यायमान गुणा) का इस्तेमाल भी किया जा सकता है। मूलभूत मान 100 है। |
तकनीकी विवरण
| संस्करण: | CSS Color Module Level 5 |
|---|
ब्राउज़र समर्थन
तालिका में दिए गए नंबर इसके पहले पूरी तरह से इस फ़ंक्शन को समर्थन करने वाले ब्राउज़र का संस्करण को प्रदर्शित करते हैं।
| Chrome | Edge | Firefox | सफारी | ओपेरा |
|---|---|---|---|---|
| 111 | 111 | 113 | 15 | 97 |
संबंधित पन्ना
संदर्भ:CSS रंग
- पिछला पन्ना CSS clamp() फ़ंक्शन
- अगला पन्ना CSS color-mix() फ़ंक्शन
- एक स्तर ऊपर CSS फ़ंक्शन रेफरेंस मैनुअल
