单列布局,两侧都有液体图像

时间:2012-05-12 20:20:40

标签: css layout liquid-layout

我希望能够做到的是一个700px的列,左边有一个图像,宽度为20%,右边有一个图像,右边的图像占据了页面的其余部分侧。因此,从左到右,将有一个20%宽的图像,然后是一个700px宽的列​​,其中包含该站点的内容,然后右侧的图像占据页面的其余宽度。我一直在努力解决这个问题,我觉得我太复杂了。

1 个答案:

答案 0 :(得分:0)

<div id="leftImage" style="float:left;width:20%;background-repeat:no-repeat;background-image:url(URL TO LEFT IMAGE); height: HEIGHT OF LEFT IMAGE IN px;">&nbsp;</div>
<div id="content" style="width: 700px;float:left;">CONTENT</div>
<div id="rightImage" style="float:left;background-repeat:no-repeat;background-image:url(URL TO RIGHT IMAGE); height: HEIGHT OF RIGHT IMAGE IN px;">&nbsp;</div><br clear="all" />

尝试类似的东西。