Question

当我将不透明度设置为我的主体div类时，它会使文本和其他所有内容都不透明。我只希望灰色背景具有不透明度。这是我的代码：

<div class="main1">
content
</div>

CSS：

.main1
{
background-color:#333333;
border:2px solid #7C7C7C;
text-align:center;
width:1250px;
top:auto;
bottom:auto;
left:300px;
right:300px;
margin-left:auto;
margin-right:auto;
}

发生这种情况时，一切都变得不透明。有什么帮助吗？

Answer 1

只为背景颜色赋予不透明度

background-color: rgba(51,51,51,0.5);

Answer 2

在内部制作2个div，并且彼此相同，然后让它们重叠，然后让div 1具有不透明度，div2具有内容。我会附上一个例子但是在使用我的手机

Answer 3

background-color:rgba(51, 51, 51, 0.5)

如果您的BG将是一种颜色，您可以使用上面代码中为0.5的alpha过滤器。

Answer 4

将背景颜色设置为rgba（r，g，b，不透明度）

background-color：（51,51,51,0.2）。

这将仅在背景上设置不透明度，而不是整个div（包括您的文本））

您可以使用converter将十六进制颜色转换为rgb颜色。

Answer 5

你还需要为文字着色!!首先像其他人说的那样使用CSS背景色。这是完整的代码和JS Fiddle

.main1
 {
 background-color:rgba(255,0,0,0.5);
 border:2px solid #7C7C7C;
 text-align:center;
 width:150px;
 top:auto;
 bottom:auto;
 left:300px;
 right:300px;
 margin-left:auto;
 margin-right:auto;
 color: black;

}

HTML

<div class="main1">
content
</div>

如何使Opacity仅适用于div类中的背景

5 个答案: