1background-image: url(IMAGE_URL); /* fallback for older browsers */
2
3background-image: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 100%), url(IMAGE_URL);
4
1/* Use RGBA */
2background-color: rgba(255, 255, 0, 0.75); /* Transparent Yellow */
1#bg{
2background-image: url('images/wood1.jpg');
3opacity:0.2;
4width:300px;
5height:300px;
6}
7
1body::before{
2 content: "";
3 position: absolute;
4 top: 0;
5 right: 0;
6 bottom: 0;
7 left: 0;
8 z-index: -1;
9 background-image: url(image.jpg); /*Put your image url*/
10 background-size: cover;
11 background-position: center;
12 opacity: 0.25; /*Value from 0.0 to 1.0*/
13}
1/* Two ways to make images opaque */
2
3div {
4 background-color : rgba(120, 120, 120, 0.5)
5 /* the 0.5 is the value of opacity on a scale of 0-1 */
6}
7
8/* OR */
9
10div {
11 background-color : blue
12 opacity : 50%
13}
1div {
2 opacity : 50%;
3}
4
5/* Use opacity to change the opacity of selected css */