DIV+CSS 6张图片的布局,用绝对布局怎么实现?

html-css010

DIV+CSS 6张图片的布局,用绝对布局怎么实现?,第1张

可以这样做:

<div

id="wraper">

<div

class="image1">image1</div>...</div>

#image_holder

{

position:relative其他代码}

.image1

{

position:absolute

left:**px

top:**px}

原理就是用一个大盒子将六张图片包围起来,然后大盒子用相对定位,然后让六个小盒子绝对定位,具体小盒子要放到什么地方,自己计算一下就可以了。

你好!这个当然是可以的啊。我布局一下给你,你参考一下:

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

<div style="width:210pxfloat:left">

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

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

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

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

</div>

以上都是按照你图像样式来做的,都是以图片布局形式,你可以参考一下。

希望我的回答能令你满意!