在内容中创建一个div并为其提供bg图像和模糊效果。并给它z-index减去不透明度div，类似这样。
<div class="content">
<div class="overlay"></div>
<div class="opacity">
<div class="image">
<img src="images/zwemmen.png" alt="" />
</div>
<div class="info">
a div wih all sort of information
</div>
</div>
</div>
使用CSS
.content{
float: left;
width: 100%;
}
.content .overlay{
background-image: url('images/zwemmen.png');
height: 501px;
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
z-index:0;
}
.opacity{
background-color: rgba(5,98,127,0.9);
height:100%;
overflow:hidden;
position:relative;
z-index:10;
}
602392714
清零编程群