<div class="test">
<img src="" alt="">
<div>
.test{
position:relative;
}
.test img{
position:absolute;
left:0;
top:0;
bottom:0;
right:0
margin:auto;
}
利用背景绝对定位,下面的文字相对定位就可以实现效果
<section class="client_jieren clearfix ">
<div class="lient_bg "></div>
<div class="warp_content clearfix ">
<h3 class="jieren_title">客户案例</h3>
<div class="client_banner clearfix ">
<div id="Slide1" class="lj-Slide">
<section class="client_left"></section>
<section class="client_right"></section>
<ul>
<li><img src="images/client_banner1.png" /></li>
<li><img src="images/client_banner2.png" /></li>
<li><img src="images/client_banner3.png" /></li>
<li><img src="images/client_banner4.png" /></li>
<li><img src="images/client_banner5.png" /></li>
<!--<li><img src="images/client_banner3.png" /></li>
<li><img src="images/client_banner4.png" /></li>-->
</ul>
</div>
</div>
</div>
<div class="company">
<p>杰人软件(深圳)有限公司 官网: www.jerrisoft.com <br/>粤ICP备09136162号-8</p>
</div>
</section>
.lient_bg{
background:url(../images/client_bg.png) no-repeat;
filter:alpha(opacity=40); /* IE */
-moz-opacity:0.4; /* 老版Mozilla */
-khtml-opacity:0.4; /* 老版Safari */
opacity: 0.4; /* 支持opacity的浏览器*/
width:100%;
background-size: 100% 100%;
height: 725px;
position: absolute;
z-index: 1;
}
client_jieren{
margin-top: 20px;
height: 725px;
width: 100%;
position: relative;
}
.client_jieren >.warp_content{
position: relative;
top: 0;
height: 100%;
z-index: 2;
}