Question

我试图制作一个960px，浮动左侧网站并使用带有文本的黑色transperent div。问题是文本与div具有相同的颜色，但我希望它是白色或至少与div不同。我怎么能这样做？

这是我目前的CSS，问题是该位置设置为相对，但我只想使用不同的div并使用“float：left”。如果我删除“position：relative”，则div的透明颜色会消失。

  .content {
   position:relative;
   color:White;
   z-index:10;
   float: left;
   text-align: center;
   left: 365px;
   font-family: Arial;
   margin: 10px;
   top: 15px;

}

.background {
   position:absolute;
   border-radius: 10px;
   width:960px;
   height: 70px;
   background-color:Black;
   z-index:1;

   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
   filter: alpha(opacity=50);
   opacity:.5;
   top: 80px;

}

Answer 1

使用透明背景代替：

background:rgba(0,0,0,0.5);

Answer 2

内容继承了容器的不透明度。明确将内容的不透明度设置为.5但不是1.

Answer 3

这似乎工作得很好，看到小提琴并告诉我它是否适合你。我已将宽度更改为％，但它在px上的效果也一样，我只想删除小提琴中的滚动，并将Color:White;更改为color:#fff;

Fiddle

更改透明div中文本的颜色

3 个答案: