How do I change the background opacity in CSS?

ANSWER:

1. Change background color opacity

  - Solution: Using rgba() background color.

  - Syntax : background: rgba(red, green, blue, alpha);

  - Example :

 div.bg_blue{
     background: rgba(0, 151, 19, 0.1); /* Opacity 10% */
}

.opacity-40{
     background: rgba(0, 151, 19, 0.4) !important; 
}
    
.opacity-80{
     background: rgba(0, 151, 19, 0.8) !important; 
}

And below is the result :

You can see an example here.

2. Change background image opacity

2.1 Using png image

- I recommend using this way to do 

2.2 Using opacity property CSS

- This property will apply for all element tag in this div, so if the inside box has text, that text also gets opacity and maybe the user can not see it.