我就是一道弧Stjacob's Blog|WAG

<<  为某产品的价格能吵成这样？谈谈mobile Me | 首页 | blogbus去掉日志标题旁边的分类名称  >>

• 平行div保持相同高度 (自适应) - [一些资源]

  2008/06/17

  版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
  http://stjacob.blogbus.com/logs/23102631.html
  
  

  对自己的三栏css进行修改。发现中右两栏的高度无法与左边的日志栏自动适应。日志栏由于日志的数量会变动。但如果日志栏高度低的话，又无法与中右栏高度一致。上网找了下，有一种利用overflow属性把多个div（这些div都设置了超长的高度或者宽度）进行平整，效果不太好。似乎纯粹css无法做到div高度自适应。

  这里有个方法：

  假设有div1,div2,div3(三个子div，不管哪个栏变动)。在加载页面里三个子div声明结束后（要在父div的结构里），加上：

  <script type="text/javascript">

  var a=Math.max(document.getElementById("div1").offsetHeight,document.getElementById

  ("div2").offsetHeight,document.getElementById("div3").offsetHeight);

  document.getElementById("div1").style.height = a + "px";

  document.getElementById("div2").style.height = a + "px";

  document.getElementById("div3").style.height = a + "px";
  </script>  

   

  就是比较三个栏的高度大小，取出最大值。然后全部赋值为最高的。
   

  
  

  随机文章：

  firefox,ie 6,7下div问题 2008/06/20

  调试blog模板 2007/09/06

  blogbus去掉日志标题旁边的分类名称 2008/06/18

  精巧的图形处理软件--SnagIt 2008/04/25

  解决字幕 2008/03/13

  
  收藏到：Del.icio.us

  
  
  
  
  
  Tag：div 自适应 相同高度 css javascript

  stjacob 发表于16:35:55 | 编辑 | 继续话题 | 转发 | 推荐 | 分类：一些资源

  引用地址：

Feed

Douban