css设置块元素在div内竖着排列

html-css013

css设置块元素在div内竖着排列,第1张

<div id="main" style="float:leftwidth:100pxheight:500px">

<div id="left" style="float:left width:20pxheight:20px padding-right:10px">

<div id="l1"></div>

<div id="l2"></div>

<div id="l3"></div>

</div>

<div id="middle" style="float:left width:20pxheight:20px padding-right:10px">

<div id="m4"></div>

<div id="m5"></div>

<div id="m6"></div>

</div>

<div id="right"style="float:left width:20pxheight:20px padding-right:10px">

<div id="r7"></div>

<div id="r8"></div>

<div id="r9"></div>

</div>

</div>

思路,一个大div main里面放三个小div 左中右

左边放三个div 左1左2左3,float左浮动。一定要设置长宽,这样才能浮动。

同理 中间放三个,右边放三个。。

设置背景色的时候,不能用repeat-y这类属性,也不能用背景定位background-position,这些属性只用在背景图片的时候。还有在设置高度的时候最好不要用百分比,将样式修改一下就OK了。

希望有用,谢谢!