पृष्ठभूमि-रंग - सीएसएस-ट्रिक्स

सीएसएस में पृष्ठभूमि-रंग की संपत्ति एक तत्व पर पृष्ठभूमि के रूप में ठोस रंग लागू करती है। यहाँ एक उदाहरण है:

html ( background-color: #82a43a; )

ऊपर उपयोग किए गए उदाहरण ( #82a43a) को हेक्स कोड कहा जाता है, और यह कई तरीकों में से एक है जो सीएसएस को एकल रंग का प्रतिनिधित्व करना है। सही हेक्स कोड खोजने के कई तरीके हैं। जिसने भी एक डिज़ाइन टूल का उपयोग किया है, उसने इस रंग के समान रंग का पिकर देखा है:

हेक्स कोड सीएसएस में एक रंग घोषित करने का एक तरीका है। नामों का एक पूरा समूह भी है, जिनका आप उपयोग कर सकते हैं, उदाहरण के लिए:

.page-wrap ( background: white; ) footer ( background: black; ) .almonds ( background: blanchedAlmond; )

ये रंग बहुत लचीले नहीं हैं, लेकिन ये चुटकी में काम में आ सकते हैं। वे हेक्स कोड से याद रखना आसान है, और उनमें से एक टन हैं।

रंग घोषित करने का दूसरा तरीका RGB, RGBa, HSL या HSLa का उपयोग करना है:

#page-wrap ( background: rgba(0, 0, 0, 0.8); /* 80% Black */ ) .widget ( background: hsla(170, 50%, 45%, 1); )

हेक्स कोड के विपरीत, ये मूल्य पारदर्शिता (अल्फा) के लिए अनुमति देते हैं, जो सुपर उपयोगी हो सकता है। RGBa या HSLa के बारे में अधिक जानें।

डेमो

CodePen पर CSS-Tricks (@ css-tricks) द्वारा पेन बैकग्राउंड-कलर देखें।

सम्बंधित

• पृष्ठभूमि संलग्न
• बैकग्राउंड-क्लिप
• पृष्ठभूमि छवि
• पृष्ठभूमि मूल के
• पृष्ठभूमि स्थिति
• पृष्ठभूमि दोहराएँ
• पृष्ठभूमि का आकार

और अधिक संसाधनों

• CSS3 की कल्पना
• एमडीएन

ब्राउज़र का समर्थन

हेक्स कोड और अधिकांश रंग नाम हर जगह काम करते हैं। RGBa और HSLa के ब्राउज़र समर्थन के अपने सेट हैं: RGBa और HSLa।

क्रोम	सफारी	फ़ायर्फ़ॉक्स	ओपेरा	अर्थात	एंड्रॉयड	आईओएस
काम करता है	काम करता है	काम करता है	काम करता है	काम करता है	काम करता है	काम करता है