div+CSS 网页布局分两栏时,如何让两栏同等高度。请求帮忙,急!!谢谢?

2025-01-05 11:08:47
推荐回答(5个)
回答1:

因为你使用了float,所以left和right都已经不在正常的流中了,所以他们之间的以及父元素之间的高度都是互相独立的。
所以要想不使用javascript,而又要这两者之间有关系的话就不能使用float。
通常要进行准确的布局都是通过table来解决
参考下,必要的时候给left和right设置宽度



内容

内容

内容

内容

内容

内容




回答2:

其实就用js还简单些,到处都是现成的代码,传这两个div的id给js就处理好了

 

不用js的话,纯css技术到目前基本上主流的方法:都是用一张背景图来模拟的,就是给你外面那个大div设置个背景图竖着重复

 

如果你一定要css,又不愿意设置背景图的话,给你个方法,纯css的(IE8、FF下测试通过,IE6和其他浏览器在我记忆中也是ok的):








左边




/*
* 如果你弄懂了高度是怎么继承父级的高就好理解了
* 另外不推荐这个办法,新手用可能造成其他一些混乱而找不到问题根源
*/
body{
text-align: center;
margin: 0;
padding: 0;
}
html , body{height: 100%;}/*关键是把html高度设置为100%,为了避免有些内核是去认body,把body也写上保险*/
.wrapper{
width: 960px;
height: 100%;/*包含浮动的大div高度也设置成100%*/
margin: 0 auto;
text-align: left;
}
#left , #right{
float: left;
_display: inline;
height: 100%;/*左右浮动两个div高也设置成100%*/
}
#left{
width: 260px;
background: #666;
}
#right{
width: 700px;
background: #ccc;
}

回答3:

要是CSS样式的话在左右两个DIV样式里加{padding-bottom:10000px; margin-bottom:-10000px;},这样两个DIV就等高了。
还有JS可以实现,百度JS div等高就可以找到了。。。

回答4:


内容


回答5:

在css中,你不是有id吗,直接给分配的id,写死长,宽