给一个div加上黑色遮罩
接着整理这个是之前写过的一个页面现在整理一下 发出来
就是给页面加个黑色的遮罩设置透明度我在实际中写的是 给段视频加上遮罩 放置视频太亮导致视觉效果不好
好了 下面 简述下原理
在一个div下 添加背景为黑的 另一个div设置透明度（注意兼容性 ） 然后设置定位position：absolute ；就是让它定在那上面不然正常文档流下 肯定就跑到下面去了 无法覆盖（说话颠三倒四）
重新说： 就是一个大的div用relative定位然后里面放两个子div一个是不被遮的另一个是遮罩（用absolute定位），最后用js控制显示状态的变化over
.warp{
absolute:relative;
}
.main{
width:600px;
height:600px;
border:1px solid #cccccc;
color:red;
font-size: 22px;
}
.filter{
width:700px;
height:700px;
background-color:black;
position:absolute;
left:0;
top:0;
filter:alpha(opacity=50); /*IE滤镜，透明度50%* ie89 支持*/
-moz-opacity:0.5; /*Firefox私有，透明度50%*/
opacity:0.5; /*其他，透明度50%*/
z-index:99;
display:none;
}
.close{
font-size: 22px;
color:red;
margin:50px auto;
}
弹出遮罩
关闭
【给一个div加上黑色遮罩】
代码
推荐阅读
- 一个人的旅行，三亚
- 一个小故事，我的思考。
- 一个人的碎碎念
- 七年之痒之后
- 我从来不做坏事
- 喂，你结婚我给你随了个红包
- 异地恋中，逐渐适应一个人到底意味着什么（）
- 成交的种子咖啡冥想
- 一百二十三夜，请嫁给我
- 迷失的世界（二十七）