div背景色半透明(div添加背景并半透明)
css设置背景半透明
首先，用大家比较熟悉的CSS属性opacity来改变div的背景颜色。
描述：
外面大的div背景颜色为黄色，里面小的div的背景颜色为红色，现在我们需要设置大的div的背景颜色变成半透明状态，我们将opacity的属性值设为0.5，代码如下：
HTML部分：
1
2
3
我是内容
CSS部分：
1
2
3
4
5
6
7
8
9
10
11
.aa{
width: 250px;
height: 250px;
background: yellow;
opacity: 0.5;
}
.bb{
width: 150px;
height: 150px;
background: red;
}
背景颜色的确变成了半透明，但是里面小div的背景以及文字都变成半透明了，这可能不是我们想要的效果，所以我们一般不使用这种方法。当然了，如果在页面布局时，你希望div里面所有的都变透明，就用opacity。
接下来我们用另一种方法，background-color:rgba(0,0,0,0~1)，使用这个方法就只会设置div背景透明，而不会影响到div里的内容。
HTM部分一样，只需要将opacity换成rgba即可。
代码如下：
1
2
3
4
5
6
7
8
9
10
.aa{
width: 250px;
height: 250px;
background-color: rgba(255,255,0,0.5);
}
.bb{
width: 150px;
height: 150px;
background: red;
}
大的div透明度改变以后，对里面的背景和文字都没有任何影响。所以我们一般用background-color:rgba(0,0,0,0~1)来设置背景颜色透明。
div设置背景半透明
#a{
background:#FFCC33;?
filter:alpha(opacity=50);??/*支持?IE?浏览器*/
-moz-opacity:0.50;?/*支持?FireFox?浏览器*/
opacity:0.50;??/*支持?Chrome,?Opera,?Safari?等浏览器*/
width:?300px;
height:300px;
}
还有一种仅让背景半透明，里面内容不会透明
#a{
background:?rgba(255,204,51,?0.5);
width:?300px;
height:300px;
}
前三个值表示颜色的red,green,blue值
最后一个表示alpha值，就是透明度值，不透明为1
为什么我div加上图片之后图片是半透明状态的，而且div的背景色怎么调成无色？
不知道你background是怎么设置的，如果你同时设置了背景图片和背景色，那么你要把背景图片写在背景色前面，否则背景色会覆盖背景图片；简写的话就是：
background: url(图片) no-repeat #666;不简写的话就是先写background-image再background-color
如果不设置背景色的话，那么div默认是没有颜色的，你看到的背景色只是底层其他div的颜色而已，如果所有层都没设定颜色，那就是body默认自带的白色，也就是浏览器自带的白色；
至于你这里图片变为半透明，可能是你本身图片就被处理成了半透明效果，不会是背景色覆盖图片这个原因，因为背景色默认不会有透明度，要挡住的话就绝对看不到图片了；要不然就是你给div设置了半透明滤镜，造成div背景半透明效果并把背景图片覆盖了
我建议你半透明滤镜少用，因为兼容性不好，如果你想要背景色半透明，建议你还是用ps把有色图层处理成半透明效果后切成1*1px的图片做背景平铺，再在这个div内添加你所要的图片
CSS如何定义DIV背景半透明颜色
“长城郭靖”回答的是错的，他答的是让整个元素半透明
只让背景半透明只有一个办法，就是用rgba颜色，代码如下
background:?rgba(0,?0,?0,?0.5)
解释：这是黑色半透明的代码
前三个值表示颜色的red,green,blue值
最后一个表示alpha值，就是透明度值，不透明为1
（支持IE8+以及所有现代浏览器）
还是不懂的话，可以参考 百度百科 “rgba”词条 和 “CSS 颜色值”词条