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

html-css011

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

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

opacity:0.8

-moz-opacity:0.8

filter:alpha(opacity=80)

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

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

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

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

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

围观一堆坑货。人家说的是CSS实现。

CSS3以下的是几乎无法实现的(可以利用.HTC这种古董东西)

实现代码(简化过了，只包含关键代码，不可直接使用)：

<!DOCTYPE html>

<!-- 上面的DocType是HTML5声明防止某些浏览器不识别，旧版本IE(低于或者等于IE8)无效 -->

<div class="outer">

<div class="inner">

</div></div> .outer {

background:pink

width:100%height:100%

position:relative

}

/* 为了实现透明效果我们要有个背景 */

.inner {

background:black

width:300pxheight:300px

position:absolute

border-radius:100%

behavior:url(yourbehavior.htc)

}

/* 用CSS3新特性圆角来做出圆形效果，border-radius设定为100%为完全圆角(把整个元素变成椭圆形，如果是像素则会制作出一个绝对正圆的圆角，类似圆角长方形或者香肠形)。

宽高必须相等才是正圆。

位置相对定位来保证圆的位置，本例随便做的位置。

behavior是IE低版本的一个绘图功能组件，现在网上有许多可以现成使用的behavior，例如PIE.htc，挑选一个能实现圆角效果并且最适合你的插件来安装使用 */

当然，PNG实现是最简单的，也是最不负责的