Computer >> Computer tutorials >  >> Programming >> CSS

Set the opacity for the background color with CSS


To set the opacity for the background color, use the opacity property with RGBA color values.

Example

You can try to run the following code to implement the opacity property:

<!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>