css+div布局,左右两个div怎么能自动适应高度

html-css05

css+div布局,左右两个div怎么能自动适应高度,第1张

可以通过js实现两个div自适应同等高度,如下:

先设置div+css 基本布局:

<div id="mm">

<div id="mm1">左边</div>

<div id="mm2">右边</div>

</div>

js 实现 div 自适应高度

代码如下:

<script type="text/javascript">

<!--

window.onload=window.onresize=funct {

if document.getElementByIdx_x "mm2" .clientHeight<document.getElementByIdx_x "mm1" .clientHeight {

document.getElementByIdx_x "mm2" .style.height=document.getElementByIdx_x "mm1" .offsetHeight+"px"

}

else{

document.getElementByIdx_x "mm1" .style.height=document.getElementByIdx_x "mm2" .offsetHeight+"px"

}

}

-->

</script>

由于margin, padding 的百分比数值是相对父元素的宽度计算的,只需将元素垂直方向的一个padding值设定为与width的一定比例就可以了。比如正方形:

未完待续

left、center和right分别是居左、居中以及居右

repeat 背景图像在纵向和横向上平铺

no-repeat背景图像不平铺

repeat-x 背景图像在横向上平铺

repeat-y 背景图像在纵向平铺