如何设置网页背景透明度而不让内容透明

使用rgba()

  • 背景无图片,只是设置背景颜色的透明度
body{
width: 100%;
height: 100%;
background: rgba(255,255,255,0.8);
}
  • 背景有图片

使用background: rgba(255,255,255,0.8);时,rgba中的a只对背景颜色起作用,不对图片起作用,所以我们就想出了在背景前加上一个div,是这个div覆盖整个背景,然后设置此div的透明度就可以达到图片的透明度而不让文字透明。

width: 100%;
height: 100%;
margin: 0;
}
body{
text-align: center;
background: url(tulip_ballade_s.jpg) ;
}
 #a{
width: 100%;
height: 100%;
background: rgba(255,255,255,0.8);
}````

你可能感兴趣的:(如何设置网页背景透明度而不让内容透明)