Question

css在灰色透明的背景下，如何才能使上面的字的颜色为白色？

理想图

实际做出来后图的效果为：

请问如和使用css 才能 使得“登录” 字的颜色变白？？？ 各位大侠帮忙！ 急用





Answer 1

透明背景不是元素透明度，只有设置了元素的透明度才会出现字体也会透明，所以颜色无论设为哪一种色彩都不是理想的。

常用灰色背景透明正确方法：

1. 设置背景透明样式  .bg{ background-color: rgba(255,255,255,.5); }，但是不支持ie低版本浏览器（ie8及以下）；

2. 设置背景图片为半透明png图片.bg{ background-image:url(touming.png);}，兼容性较好，但是ie6浏览器下需要引用‘ie6下png图片透明插件’（例如：DD_belatedPNG）。但是微软已经宣布淘汰ie6浏览器，ie6已不再成为兼容调节的主流。

Answer 2

background:rgba(0,0,0,0.6);这种灰色背景不会被子元素继承。但是只支持高版本浏览器。

Answer 3

楼主是对整个登录 div 设置了opacity，因此整个登录框都是半透明的。

其实只需要给这个白色background的登录框改一下background-color就可以了：
.login{
background-color: rgba(255,255,255,.5);

}

Answer 4

背景的圆角矩形用带透明通道的rgba颜色代替opacity，opacity会自动继承给子元素。

Answer 5

可以使用css rgba通道
例如
<div style="background:rgba(0,0,0,0.5);color:#fff;">
一些文字
</div>
不要使用opacity来设置，因为这样会减低div标签整体的透明度，包括里面的内容，
如果使用了rgba之后，字体颜色还是灰色（一般情况为背景颜色遮盖了字体），请将字体置于顶层，用z-index属性，