css透明背景css透明背景颜色

1、首先我们新建一个html文件，添加一个DIV，设置宽度和高度，以及背景色填充为红色。

2、然后在父级DIV中插入一个子DIV，定义它的宽高，以及背景色。

3、然后我们添加一个透明度的代码（opacity:0.6）。

4、在图层的上方，有个不透明度，我们把PS中图层不透明度设置为60%。

5、把刚才的背景色和不透明度代码删除，换个代码【background-color:rgba(255,255,255,0.6);】。

6、其中255,255,255就是PS中的拾色器里的数值。

实现透明的css方法通常有以下3种方式（以下是不透明度都为80%的写法）

IE专属滤镜 filter:Alpha(opacity=x)，x 的取值从 0 到 100，如filter:Alpha(opacity=80)

css中rgba()可以用来设置页面元素的颜色和透明度，rgba()颜色值是 RGB 颜色值的扩展，带有一个 alpha 通道，通过它即可实现设置元素的不透明度。

在 CSS3 中，增加了一个 opacity 属性，使用此属性可以设置元素的透明度。opacity属性具有继承性，会使容器中的所有元素都具有透明度；

一种是在css样式中用opacity属性来控制div的透明，这种方法会让div中的所有内容都变为半透明的效果，如下所示的例子：

运行效果如下图所示：

不管是文字还是背景都变成半透明的了。

第二种方法是，通过background-color或者background属性，将颜色值设置为带透明度的值：rgba(255,255,0,0.5)。 最后一个值即为设置透明度。如下例子所示：