2 个回答

这样吧,就按照你标题中透露的信息,写一个Demo。
背景图半透明,但是文字不透明:

.middleBom {
  width: 45%;
  height: 25%;
  padding: 0.3rem;
  margin: 0;
  position: absolute;
  bottom: 3%;
   
}
.middleBom:before {
  content: "";
  width: 100%;
  height: 100%;
  background: url("../../assets/image/Slice-42_03.png") center/100% 100% no-repeat;
  display: block;
  position: absolute;
  opacity: 0.7

但其实应该让UI给你提供一个没有背景色的透明底图,然后你使用 background-color 来实现半透明的背景色。或者提供的底图就是处理好的对应透明度的 .png 图片。

单独一个div包裹这个图片,用position 定位上去,再设置opacity也是可以的,但图片中的所有元素都会被透明变浅色,还是直接换个背景透明的png吧。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题