如何改变儿童的不透明度[重复]答案

【问题标题】：How to change opacity on children [duplicate]如何改变儿童的不透明度[重复]
【发布时间】：2021-04-24 09:44:09
【问题描述】：

我可以在div 上显示低颜色，以使图像像第一张图像一样清晰吗？

我用具有不透明度的div 覆盖图像，以便在显示图像时显示div。

请告诉我是否有不使用不透明度的方法。

这就是我想要的结果：

如何定义不透明度以不影响子元素？这是我想要的：

我尝试了color: rgb(255, 255, 255);，但它显示了相同的结果。

这就是现在的样子，它不会改变孩子的不透明度。

我的 CSS

.image-cover{ 
  background:#858C94;
  opacity:0.7;
  width: 60px;
  height: 60px;
  margin-top: -66.8px;
  position: relative;
}
.mediv{
  color: rgb(255, 255, 255);
}

我的 HTML

<div class='row image-cover'>
  <div className='mediv'>2</div>
  <div className='mediv' >bk52</div>
</div>

【问题讨论】：

请发布您的 HTML 和 CSS。
“在<div> 上显示低颜色”是什么意思？
我在@TusharMaheshwari的回答中得到了答案，感谢您的帮助

标签： html css

【解决方案1】：

您可以在将父级的背景属性声明为时使用 Alpha

background:rgba(133,140,148,0.5)

而不是不透明度。所以子元素不会受到影响。

【讨论】：

这不是纵横比。那是 Alpha - 处理每像素透明度的通道。