ตั้งค่าความทึบแสงสีพื้นหลังด้วย CSS

ใช้ RGBA สำหรับสีพื้นหลัง

ใช้ rgba(red, green, blue, alpha) เพื่อกำหนดสีพื้นหลังพร้อมความทึบแสง โดยไม่กระทบเนื้อหาภายใน (ต่างจาก opacity)

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
  <style>
    div {
      background: rgb(40, 135, 70);
      padding: 20px;
    }
    div.first {
      background: rgba(40, 135, 70, 0.2);
    }
    div.second {
      background: rgba(40, 135, 70, 0.6);
    }
  </style>
</head>
<body>
  <p>RGBA color values</p>
  <div class="first"><p>20% opacity</p></div>
  <div class="second"><p>60% opacity</p></div>
  <div><p>Default Opacity</p></div>
</body>
</html>