If tutorials available on this website are helpful for you, please whitelist this website in your ad blocker😭 or Donate to help us ❤️ pay for the web hosting to keep the website running.
पिछले topic में आपने CSS में Selectors के बारे में पढ़ा और समझा , इस topic में हम बात करेंगे कि किसी text के लिए font color या background color कैसे apply करें।
CSS में colors के लिए RGB , HEX , HSL , RGBA, HSLA की कोई भी valid color value assign करके color change कर सकते हैं। या फिर आप direct colors के name भी दे सकते हैं। कुछ colors के नाम इस प्रकार हैं।
decimal में आप decimal value 0 - 255 enter कर सकते हैं। इस value को आपको hash # के साथ लिखना है। Example : #234
hexa-decimal में आप 6 digits का hexadecimal value पास कर सकते हैं। जिसमे number 0 to 9 और a to f mix कर सकते हैं। Example : #2a3b4c
rgb का मतलब red, green, blue होता है। जिसमे आप decimal value 0-255 enter कर सकते हैं। Example : rgb(123,234,211)
rgba में rgb का मतलब red, green, blue और a का मतलब opacity होता है। Opacity की value min .1 से max 1 के बीच होती है। Example : rgb(123,234,211, .3)
hls का mtlb hue, saturation, and lightness होता है। इसमें 3 values pass की जाती हैं , color , saturation, and lightness. Example : hsl(120, 77%, 38%)
hlsa में hls का mtlb hue, saturation, and lightness होता है। और a का मतलब opacity होता है। Example : hsla(64, 81%, 49%, 0.1)
CSS में किसी भी text का font color change करने के लिए color : value; property का use किया जाता है , value में आप RGB , HEX , HSL , RGBA, HSLA में से किस भी type की valid color value provide कर सकते हैं।
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS TEXT Color Example</title>
</head>
<body>
<h2 style="color: blue;">Put Direct Color Name</h2>
<h2 style="color: #199;">Decimal Color Name</h2>
<h2 style="color: #e93772;">Hexa Decimal Color</h2>
<h2 style="color: rgb(255, 99, 71);">RGB Color</h2>
<h2 style="color: rgba(166, 37, 184, 0.2);">Hexa Decimal Color</h2>
<h2 style="color: hsl(120, 77%, 38%);">HSL Color</h2>
<h2 style="color: hsla(64, 81%, 49%, 0.1)">HSLA Color</h2>
</body>
</html>
Background color change करने के लिए background-color property का use किया जाता है।
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Background Color Example</title>
</head>
<body>
<h2 style="background-color: blue;">Put Direct Color Name</h2>
<h2 style="background-color: #199;">Decimal Color Name</h2>
<h2 style="background-color: #e93772;">Hexa Decimal Color</h2>
<h2 style="background-color: rgb(255, 99, 71);">RGB Color</h2>
<h2 style="background-color: rgba(166, 37, 184, 0.2);">Hexa Decimal Color</h2>
<h2 style="background-color: hsl(120, 77%, 38%);">HSL Color</h2>
<h2 style="background-color: hsla(64, 81%, 49%, 0.1)">HSLA Color</h2>
</body>
</html>