在html5中怎么实现背景图片半透明，文本文字不透明的效果？

分类: 技术问答 • 2022-02-23 16:04:31

问题描述：

想实现背景图片半透明，文本文字不透明的效果，进行过伪类方法，但没有达到预期效果

答

用rgba，比如background:rgba(0,0,0,0.5)这个是黑色50%透明,如

div:before{
  content:'';
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.5);
 position:absolute;
  top:0;
  left:0;
}

答

背景设置rgba和相对定位
里面的文字设置绝对定位