关于带阴影的弹出层

背景
之前写过一个带遮罩的弹出层。代码大致如下：

<div class="container">
	<img >
	.....
</div>

.container{
background-color:#000;
 opaticy:0.5;
 .....
}

这样写的问题是需要弹出的图片透明了。因为父级透明了，所以子级不管设没设置透明度都没效果！
解决
方法1：
父级不设置opacity,直接使用rgba控制

<div class="container">
	<img >
	.....
</div>
.container{
background-color:rgba(0,0,0,0.5);
}

方法2：
父级不设置opacity，加一个设置了opacity的兄弟节点，绝对定位铺满。

<div class="container">
	<div class="shade"></div>
	<img >
	.....
</div>
.container{
position:relative;
}
.container>.shade{
postion:absolute;
background-color:#000;
opacity:0.5
}