CSS在设置了透明度的层里,怎么让里面的层不透明?

html-css05

CSS在设置了透明度的层里,怎么让里面的层不透明?,第1张

在外层DIV设置了CSS代码如下:

opacity:0.8

-moz-opacity:0.8

filter:alpha(opacity=80)

此时,此层里面的层都为透明层,接下来我们如何让里面的层不透明呢?主要有两个方法:

1、如果是要设置颜色层透明,可以用背景色透明rgba来代替opacity,

2、如果是设置图片层透明,就用ps简单处理一下即可。

opacity这个属性指定的透明是包括里面的所有元素的,不可能只有外面透明,里面不透明。

没有办法,子元素的透明度一定不会大于父元素的透明度,所以没有办法让父元素透明,子元素不透明,不过可以给其他不透明的元素设置position及z-index,让他位于你的透明元素之上让他看起来像是这个透明元素的子元素不透明。

1、新建html文档,在body标签中添加一个img标签,这时默认情况下图片是不透明的:

2、在head标签中添加style标签,在style标签中为img标签设置透明度样式,其中三个属性是为了兼容不同浏览器:

3、刷新浏览器中的页面,这时可以发现浏览器中图片的透明度改变了,透明度的范围是0-1,0表示完全透明,1表示不透明: