HTML एलीमेंट में बैकग्राउंड कलर जोड़ने के लिए, आप CSS प्रॉपर्टी background-color
. का इस्तेमाल कर सकते हैं ।
मान लें कि आपके पास निम्न HTML मार्कअप है, और आप <body>
में पृष्ठभूमि का रंग जोड़ना चाहते हैं तत्व:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Changing background color in HTML/CSS</title>
</head>
<body>
<h1>Here's an awesome website!</h1>
</body>
</html>
बैकग्राउंड कलर जोड़ने का सबसे आसान तरीका एक आंतरिक <style>
. बनाना है आपके HTML दस्तावेज़ में तत्व।
<head>
. में HTML में तत्व, <style></style>
. का एक सेट बनाएं टैग। फिर आप <style>
. में बैकग्राउंड कलर के लिए CSS स्टाइल रूल्स जोड़ सकते हैं तत्व।
<head>
<meta charset="UTF-8">
<title>Changing background color in HTML/CSS</title>
<style>
body {
background-color: #78a8eb;
}
</style>
</head>
इस HTML और CSS कोड के परिणामस्वरूप ऐसा दिखने वाला वेबपेज बन जाएगा!
रंग संकेत
#78a8eb
background-color
. के लिए मान संपत्ति हेक्साडेसिमल नोटेशन में लिखी जाती है, जिसे हेक्स भी कहा जाता है। यह लाल, हरे और नीले चैनलों के लिए वर्णों के एक सेट के साथ रंग का प्रतिनिधित्व करता है। वर्णों की संख्या 0 से 9 तक होती है, फिर अक्षर A-F होते हैं। शून्य (0) न्यूनतम मान है, और F उच्चतम मान है।
आप अन्य नोटेशन का उपयोग करके CSS में रंगों का प्रतिनिधित्व भी कर सकते हैं।
उदाहरण के लिए, कार्यात्मक संकेतन में, रंग को rgba()
. के रूप में स्वरूपित किया जाता है . हमारे उदाहरण में पृष्ठभूमि का रंग इस तरह लिखा जाएगा:
background-color: rgb(120, 168, 235);
या HSL (Hue, Saturation, Lightness) नोटेशन में इसे इस तरह लिखा जाएगा:
background-color: hsl(215, 74%, 70%);
रंग लिखने के इन तीन तरीकों में से कोई भी आधुनिक ब्राउज़र में स्वीकार्य है।
बहिष्कृत विधियां (उपयोग न करें)
वेब मानकों के पिछले संस्करणों में, लोग bgcolor
. का उपयोग करते थे HTML टैग में ही हेक्स रंग वाली संपत्ति:
<body bgcolor="#78a8eb" ></body>
हालाँकि, यह पृष्ठभूमि रंग सेट करने का एक पुराना तरीका है। अब आपको इसका उपयोग नहीं करना चाहिए- रंगों को नियंत्रित करने के लिए बस CSS स्टाइल लिखना जारी रखें।