CSS rgba() फ़ंक्शन

rgba() लाल, हरे, नीले और अल्फा के लिए RGBA रंग मान परिभाषित करता है। अल्फा रंग की अपारदर्शिता है यानी 0.0 और 1.0 के बीच की संख्या। यहां, 1.0 पूर्ण अपारदर्शी के लिए होगा।

उदाहरण

<!DOCTYPE html> <html> 
  <head> 
    <style> 
      #demo1 { background-color: hsla(140, 100%, 50%, 0.8); } 
      #demo2 { background-color: hsla(130, 100%, 50%, 0.6); } 
      #demo3 { background-color: hsla(190, 100%, 50%, 0.4); } 
      #demo4 { background-color: hsla(170, 100%, 50%, 0.3); } 
      #demo5 { background-color: hsl(150, 100%, 60%); } 
      #demo6 { 
        background-color: rgba(108,111,35,0.6); 
        font-size: 30px; 
        color: yellow; 
        transform: rotate(45deg); 
      } 
    </style> 
  </head> 
  <body> 
    <h1>क्रिकेटर</h1> 
    <p id="demo1">डेविड वार्नर</p> 
    <p id="demo2">स्टीव स्मिथ</p> 
    <p id="demo3">मार्क वॉ</p> 
    <p id="demo4">स्टीव वॉ</p> 
    <p id="demo5">डेविड जॉनसन</p> 
    <p id="demo6">ऑस्ट्रेलियाई क्रिकेटर</p> 
  </body> 
</html>

आउटपुट

एक और उदाहरण

<!DOCTYPE html> <html> 
  <head> 
    <style> 
      span { 
        background-color: rgba(100, 150, 50, 0.6); 
        text-decoration: line-through; 
        text-decoration-color: blue; 
      } 
      .demo2 { 
        text-decoration: underline; 
        text-decoration-color: yellow; 
      } 
    </style> 
  </head> 
  <body> 
    <h1>विवरण</h1> 
    <p class="demo">परीक्षा केंद्र <span>XYZ कॉलेज</span> ABC कॉलेज के पास।</p> 
    <p class="demo2">परीक्षा सुबह 11 बजे शुरू होती है।</p> 
  </body> 
</html>

आउटपुट

व्याख्या: rgba(108,111,35,0.6) एक जैतून हरा रंग 60% अपारदर्शिता के साथ। rgba(100,150,50,0.6) एक अलग हरा। rgb() में अल्फा नहीं होता (अपारदर्शी)। rgba() और hsla() पारदर्शिता के लिए आधुनिक तरीके हैं; #RRGGBBAA हेक्स नोटेशन भी समर्थित है (उदाहरण: #FF000080 50% अपारदर्शी लाल)।