更改透明 div 中文本的颜色答案

【问题标题】：Changing the color of the text in a transparent div更改透明 div 中文本的颜色
【发布时间】：2014-02-18 19:40:59
【问题描述】：

我正在尝试制作一个 960 像素、向左浮动的网站并使用带有文本的黑色透明 div。问题是文本与 div 的颜色相同，但我希望它是白色的，或者至少与 div 不同。我该怎么做？

目前这是我的 CSS，问题是位置设置为相对，但我只想使用不同的 div 并使用“float:left”。如果我删除“位置：相对”，则 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;

}

【问题讨论】：

标签： css html

【解决方案1】：

使用透明背景代替：

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

【讨论】：

【解决方案2】：

内容继承了容器的不透明度。将内容的不透明度显式设置为不是 0.5 而是 1。

【讨论】：

【解决方案3】：

这似乎工作正常，看看小提琴并告诉我它是否适合你。我已将宽度更改为 % 但它在 px 上也能正常工作，我只是想删除小提琴中的滚动，并将 Color:White; 更改为 color:#fff;

Fiddle

【讨论】：