开发者社区> 问答> 正文

遮罩层上面的图片显示怎么去掉半透明

测试代码


<!DOCTYPE HTML>
<html lang="ru-RU">
<head>
  <title></title>
  <meta charset="UTF-8">


<style type="text/css">

.mask{
     background: #000;
     position: absolute;
     left: 0px;
     top: 0px;
     height:100%;
     width:100%;
     z-index: 20;
     filter: alpha(opacity=60);
     opacity: 0.6;

}
.wrap{
     position:absolute;
     top:50%;
     left:50%;
     width:600px;
     height:400px;
     background: #FFF;
     z-index:21;
}
.box {
    position:absolute;
    top:-50%;
    left:-50%;
    display:block;
    width:600px;
    background: #FFF;
    height:400px;
    z-index:40px;
}

</style>
</head>
<body>


<div class="mask" id='part'   >

<div class='wrap'>

<div class='box' id='alert' style='display:none'>


<img width="100%"  src="http://img3.cache.netease.com/photo/0001/2016-05-24/BNS37GEP00AP0001.jpg" />
</div>
</div>

</div>

<script type="text/javascript">
function show(){
var alertPart=document.getElementById("alert");
alertPart.style.display="block";
/*
alertPart.style.position = "absolute";

alertPart.style.zIndex = "501";
*/



}

setTimeout(function(){

show();
},1000);

</script>



</body>
</html>

展开
收起
杨冬芳 2016-06-13 17:09:29 2951 0
1 条回答
写回答
取消 提交回答
  • 把mask层放到与内容区平级,不然 mask的opacity会影响内容区

    2019-07-17 19:36:30
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载