Question

使用CSS我正在尝试在具有透明背景的框中显示html元素。但是到目前为止，我放在这样一个盒子中的任何东西都继承了容器的透明度。我只希望盒子/容器的背景是透明的。

这里是一个例子 https://www.w3schools.com/code/tryit.asp?filename=G1ZKVE7QV7OU

代码

<!DOCTYPE html>
<html>
<head>
<style>
div.background {
  background: url(https://pixy.org/src/475/4751044.png) repeat;
  border: 2px solid black;
}

div.transbox {
  margin: 30px;
  background-color: #ffffff;
  border: 1px solid black;
  opacity: 0.5;
  filter: alpha(opacity=60); /* For IE8 and earlier */
}

div.transbox p {
  margin: 5%;
  font-weight: bold;
  color: #000000;
}
</style>
</head>
<body>

<div class="background">
  <div class="transbox">
    <p>This is some text that is placed in the transparent box.</p>
    <img src="https://cdn.britannica.com/s:300x300/55/174255-004-9A4971E9.jpg">
  </div>
</div>

</body>
</html>

在此示例中，文本和母牛是透明的，我希望它们是不透明的。

将不透明的东西放在透明的CSS盒子中

0 个答案: