内部元素上的不透明度CSS？
内部元素上的不透明度CSS？
提问于 2014-04-14 06:46:18
在主包装元素上，我有一些不透明度，但是我不能弄清楚内部元素的样式吗？
这是一个例子
<div class="wrapper">
<div class="inner">
</div>
</div>这是CSS
.wrapper{
width:400px;
height:500px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* IE 8 */
filter: alpha(opacity=60); /* IE 5-7 */
-moz-opacity: 0.6; /* Netscape */
-khtml-opacity: 0.6; /* Safari 1.x */
opacity: 0.6;
background-color:red;
}
.inner{
width:200px;
height:300px;
background-color:blue;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */
filter: alpha(opacity=100); /* IE 5-7 */
-moz-opacity: 1.0; /* Netscape */
-khtml-opacity: 1.0; /* Safari 1.x */
opacity: 1.0;
}即使重要也无济于事？这是工作小提琴http://jsfiddle.net/Pq4LS/
回答 2
Stack Overflow用户
回答已采纳
发布于 2014-04-14 06:49:23
您不能强迫一个孩子比它的父级具有更高的不透明度。
在这种情况下，您可以设置一个部分透明的background-color或background-image。
http://jsfiddle.net/Pq4LS/2/
.wrapper{
width:400px;
height:500px;
background-color: rgb(255, 0, 0); /* Oops, don't forget to set a fallback colour for older browsers */
background-color: rgba(255, 0, 0, 0.6);
}
.inner{
width:200px;
height:300px;
background-color:blue;
}Stack Overflow用户
发布于 2014-04-14 06:54:04
，这是什么意思？请改进你的问题
我改变了它的不透明性
.wrapper{
width:400px;
height:500px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE 8 */
filter: alpha(opacity=100); /* IE 5-7 */
-moz-opacity: 1; /* Netscape */
-khtml-opacity: 1; /* Safari 1.x */
opacity: 1;
background-color:red;
}
.inner{
width:200px;
height:300px;
background-color:blue;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* IE 8 */
filter: alpha(opacity=60); /* IE 5-7 */
-moz-opacity: 0.6; /* Netscape */
-khtml-opacity: 0.6; /* Safari 1.x */
opacity: 0.6;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/23053622
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号