Question

DIV+CSS实现多张图片的布局

仅仅使用CSS的左浮动能够实现如图所示的图片布局吗？

Answer 1

　　你好！这个当然是可以的啊。我布局一下给你，你参考一下：
　　<div style="width:100px; margin:0px 10px 0px 0px; float:left"><img border="0" src="image/1.jpg" width="100" height="110" /></div>
　　<div style="width:210px; float:left">
　　 <div style="width:100px; float:left"><img border="0" src="image/2.jpg" width="100" height="50" /></div>
　　 <div style="width:100px; margin:0px 0px 0px 10px; float:left"><img border="0" src="image/3.jpg" width="100" height="50" /></div>
　　 <div style="width:100px; margin:10px 0px 0px 0px; float:left"><img border="0" src="image/4.jpg" width="100" height="50" /></div>
　　 <div style="width:100px; margin:10px 0px 0px 10px; float:left"><img border="0" src="image/5.jpg" width="100" height="50" /></div>
</div>
　　 以上都是按照你图像样式来做的，都是以图片布局形式，你可以参考一下。
　　希望我的回答能令你满意！

Answer 2

楼上的代码不是很正确啊~~~~

第一 有DIV浮动的话 最外层该有个 大的div   否则 所有的图片将会 分散到最左边  做网站不是要有版心的吗？

• <div style="margin: 0 auto; width:980px;">

<div style="width:100px; margin:0px 10px 0px 0px; float:left"><img border="0" src="image/1.jpg" width="100" height="110" /></div>

　　<div style="width:210px; float:left">

　　 <div style="width:100px; float:left"><img border="0" src="image/2.jpg" width="100" height="50" /></div>

　　    <div style="width:100px; margin:0px 0px 0px 10px; float:left"><img border="0" src="image/3.jpg" width="100" height="50" /></div>

　　    <div style="width:100px; margin:10px 0px 0px 0px; float:left"><img border="0" src="image/4.jpg" width="100" height="50" /></div>

　　    <div style="width:100px; margin:10px 0px 0px 10px; float:left"><img border="0" src="image/5.jpg" width="100" height="50" /></div>

</div>

• </div>

  加上  有点的div  这样 版心就是在正中间了 

• 小以纠正 

Answer 3

可以实现，你可以
<div>
<div ></div>
<div >
<div>
<div></div>
<div></div>

</div>
<div>
<div></div>
<div></div>

</div>

</div>

</div>
这样的框架写，css自己完成吧

Answer 4

可以的，这种布局很工整，有规律，比较好布局。

Answer 5

可以，有问题Q我