CSS之DIV长度相等的几个办法

用于布局架构:
#outer{
 overflow:hidden;
}
#outer .panel{
 float:right;
 width:286px;
 padding-left:21px;
 border-left:1px solid #E5E3D7;
 padding-bottom: 27670px !important;
 margin-bottom: -27670px !important;
}
#outer .main{
 float:left;
 width:510px;
 padding-bottom: 27670px !important;
 margin-bottom: -27670px !important;
}
用于表格的JS代码:
<script>
function div(){
 var l=document.getElementById("div1").getElementsByTagName("li");
 var num=4;
 var i=l.length / num ;
 for(var a=0;a<i;a++)
 {
  var max=l[num*a].scrollHeight;
  var kk=num*a;
  var dd=num*a;
  for(kk;kk<l.length;kk++)
  {  
   if(max<l[kk].scrollHeight)
   {
    max=l[kk].scrollHeight;
   }  
   if(kk==num*(a+1)-1)
   break;
  }
  for(dd;dd<l.length;dd++)
  {
   l[dd].style.height=max+"px";
   if(dd==num*(a+1)-1)
   break;
  } 
 }
}
</script>
ps:在div里面调用div()就把里面的li重复4列的循环!
 

时间: 2024-12-09 00:43:47

CSS之DIV长度相等的几个办法的相关文章

网页制作技术CSS之DIV长度相等的几个办法

用于布局架构: #outer{overflow:hidden;}#outer .panel{float:right;width:286px;padding-left:21px;border-left:1px solid #E5E3D7;padding-bottom: 27670px !important;margin-bottom: -27670px !important;}#outer .main{float:left;width:510px;padding-bottom: 27670px !

网页制作总结:用CSS使DIV层水平居中

css|网页 一,用CSS使DIV层水平居中 对需要水平居中的DIV层添加以下属性: margin-left: auto;margin-right: auto; 这样在FF中已经居中了,可是在IE中看还是没有居中! 问题并不在CSS而在XHTML网页本身.需要加上这样的代码才能使得上述设置有效果: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xh

让div+css的div居中而里面的文字不居中的做法

让div+css的div居中, 而里面的文字不居中的做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <

CSS结合DIV实现的右侧浮动效果

  我们见过很多页面右侧浮动效果,最早有QQ联系面板,对联广告等,大多数都是基于Javascript实现的动态效果,今天我给大家分享一个只需要CSS结合DIV实现的右侧浮动效果. HTML 我们希望悬浮效果最后加载,因此一般将其放置在页面HTML的末尾,我们建立一个.side-bar,里面包含了QQ在线咨询,微信(鼠标滑向弹出二维码效果),微博,以及Email联系方式等内容,这些内容我们都以标签包裹. 代码如下:       <div class="side-bar">  

用CSS让DIV层水平居中

一,用CSS让DIV层水平居中 对需要水平居中的DIV层添加以下属性: margin-left: auto; margin-right: auto; 这样在FF中已经居中了,可是在IE中看还是没有居中! 问题并不在CSS而在XHTML网页本身. 需要加上这样的代码才能使得上述设置有效果: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/

纯CSS结合DIV实现的右侧底部简洁悬浮效果

 我们见过很多页面右侧浮动效果,最早有QQ联系面板,对联广告等,大多数都是基于Javascript实现的动态效果,今天我给大家分享一个只需要CSS结合DIV实现的右侧浮动效果.   HTML 我们希望悬浮效果最后加载,因此一般将其放置在页面HTML的末尾,我们建立一个.side-bar,里面包含了QQ在线咨询,微信(鼠标滑向弹出二维码效果),微博,以及Email联系方式等内容,这些内容我们都以<a>标签包裹. 代码如下: <div class="side-bar"&g

css控制div不能居中的解决办法

  1.css控制div不能居中最容易犯的也最简单的就是没写DTD语句,不符合w3c规则,这个解决起来很容易,在页面的最上方加上: 就行了!其实还有很多css失效的问题也都是因为没有写dtd语句而引起的. 2.使用margin来让DIV居中 最简单的写法就是: .divtemp{ margin:0 auto; } 还可以这样: .divtemp{ margin-left:auto; margin-right:auto; } 这样就可以让DIV居中了! 用css控制div居中

css的div宽度多了一部分

问题描述 css的div宽度多了一部分 一致找不到蓝色背景下的那个3px的粉红色背景是咋个产生的,望高手赐教啊,小弟感激不尽 附上源码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <style> html,div{margin:0px;padding: 0p

CSS设置DIV Herf底层图片和链接同时改变,兼容IE,Firefox,Opera,Safari,Chrome等

/*CSS樣式設置 塗聚文 Geovin Du**/ .text8 { font-family: Arial, Helvetica, sans-serif; background-image: url(../images/05.jpg); height:42px; text-align:center; } .geovindu { cursor:auto; text-decoration: none; color: #000; } a.geovindu:hover .text8 { /*backg