CSS Color Property in Hindi – सिएसेस कलर को कैसे उपयोग करें?

by
Table of Contents hide
1 CSS Color in Hindi
2 CSS Color Property कैसे लिखी जाती है?
3 Color Name
4 Hexa Code
5 RGB Code
6 Text Color कैसे लगायें?
7 Background Color कैसे लगायें
8 Border Color कैसे लगायें
9 अन्य CSS tutorial के सुझाव

CSS Color in Hindi

CSS Color से हम एक वेबसाइट को कलरफुल बना सकते हैं | जिससे पूरी वेबसाइट का लुक बहोत अच्छा हो जाता है | CSS Color Property के  जरिये text का कलर,  background का कलर या फिर बॉर्डर कलर लगाया जा सकता है |

CSS Color Property कैसे लिखी जाती है?

बाकि css property की तरह css color को भी Propert:value सेट से दरसाया जाता है |

CSS Color Value को 3 तरह से लिखी जाती है :

  1. कलर के नाम Color Name (green, blue, red)
  2. हेक्सा कोड Hexa Code (#ff0000, #fff000)
  3. आर.जी.बी R.G.B (0,0,255)

Color Name

CSS property की value Color के नाम दी जा सकती है जैसे green, blue, red, maroon |

Hexa Code

Hexa Code में css value को #सिंबल और 6 digits से दरसाया जाता है, जैसे की #RRGGBB | इस 6 डिजिट में पहले 2 डिजिट रेड कलर, दुसरे 2 डिजिट ग्रीन कलर और आखिरी 2 डिजिट ब्लू कलर को दर्शाता है |

उदाहरण:
#ff0000 (रेड कलर का हेक्सा कोड है)
#0000ff (ब्लू कलर का हेक्सा कोड है)

अलग अलग डिजिट के combination से अलग कलर बनता है पर हर hexa color # सिंबल के साथ लिखी जाती है |

RGB Code

RGB Code red, green और blue को दर्शाता है | इन तीनो कलर के मेल से बाकी कलर बनते हैं और RGB की value 0 से लेकर 255 तक दी जाती है |

Syntax: rgb(0,0,255) /* 0 से 255 के अंदर कोई भी अंक दे सकते हैं, उसी हिसाब से फिर कलर combination बनेगा */

उदाहरण:
h1 {color:rgb(255,0,0);} /* red */
h2 {color:rgb(0,255,0);} /* green */
h3 {color:rgb(0,0,255);} /* blue */

Text Color कैसे लगायें?

CSS Property के जरिये html पेज में text कलर देने के लिए color property का इस्तेमाल होता है |

Syntax: tag{ color : value; }

उदाहरण: h1{ color: maroon;}

Background Color कैसे लगायें

जैसे की नाम से पता चल रहा है किसी भी element की background को color देना है तो background-color property का इस्तेमाल होता है |

Syntax: tag{ background-color : value; }

उदाहरण: h1{ background-color : yellow;}

Border Color कैसे लगायें

किसी element की border color दो तरीके से सेट की जा सकती है | border-color property के जरिये और border property के जरिये |

Syntax: tag{ border-color : value; }
tag {border : [width] [style] [color]}

उदाहरण: p{ border-color : maroon;}
p{ border: 2px solid maroon;}

Sample Code

<html>
   <head>
      <style>
         h4{ color: darkred;}
         h2{ color: #0000ff;}
         h3{ color: rgb(255,0,0);}
         p{ background-color:yellow; border: 3px solid red;}
         h1{ background-color: #00bfff; 
         border-width: 3px;
         border-style: inset;
         border-color: rgb(243, 0, 0);
         }
      </style>
   </head>
   <body>
      <h4>Color Name Property Example</h4>
      <h2>Hexa Code Value Example</h2>
      <h3>RGB Value Example</h3>
      <p>Sample code to show border color and backgroung color</p>
      <h1>
      border color and backgroung color</h4>
   </body>
</html>

अन्य CSS tutorial के सुझाव