Question

css 如何让三张图片重叠在一起

如上图，我想让下面两块图片分别在第一块的左右，我该如何设置CSS样式？
请高手指点
是覆盖在第一块上，然后在覆盖的基础上左右分布

Answer 1

用定位做，
<div class="box">
<div class="left"></div>
<div class="center"></div>
<div class="right"></div>
</div>
.box{position:relative;}
.left{position:absolute; top:0; left:0;}
.center{position:absolute; top:0; left:;}
.right{position:absolute; top:0; left:0;}

中间填写你第一块的宽
或者你用浮动做：
把原图放在一个<div>里，然后在这个<div>里插入一个空<span>标签，然后在css样式里，给这个span加上背景图，这个背景图就是指原图的装饰。
CSS样式如下：注意在div(本例中class命名为grd )的样式里position被设成relative(相对); 而在span里position被设成absolute(绝对)；这个非常重要！而其它样式比如：width(宽度)，top(上间距) 都可以根据实际情况来定。
<style type="text/css"> .grd { border:1px solid #CECECE; padding:50px; height:50px; width:147px; position:relative; } .grd span{ background: url(/images/hot.gif) no-repeat; display: block; position: absolute; width: 35px; height: 58px; top: 5px; left:140px; border: 0px; } </style>

有了上面的CSS，HTML可以这样写：
<div class="grd"> <span></span> <img src="/images/61dh.png" border="0"/> </div>

Answer 2

用定位做，

<div class="box">
    <div class="left"></div>
    <div class="center"></div>
    <div class="right"></div>
</div>
.box{position:relative;}
.left{position:absolute; top:0; left:0;}
.center{position:absolute; top:0; left:;}
.right{position:absolute; top:0; left:0;}

中间填写你第一块的宽

或者你用浮动做，一个道理