读书人

下上两表格各列对其有关问题

发布时间: 2012-09-28 00:03:35 作者: rapoo

上下两表格各列对其问题
由于下边表格出现滚动条,导致上下各列不能对其了。怎么让这个两个表格各列对其?

PHP code
<div height="23px" style="overflow: hidden;"><table border="1px" cellpadding="0" cellspacing="0"   width="98.5%"><tbody>  <tr class="tr" align="center" cols="5">  <td width="20%">姓名</td>  <td width="20%">性别</td>  <td width="20%">民族</td>  <td width="20%">号码</td>  <td width="20%">操作</td>  </tr></tbody></table></div><div  style="overflow: auto;height:230px;" ><table border="1px" cellpadding="0" cellspacing="0"   width="100%"><tbody>  <?php      $sql="select * from `test`";      $sqln=mysql_query($sql);      while($row = mysql_fetch_array($sqln)){  ?>  <tr class="tr1" align="center" cols="5">  <td width="20%"><?php echo $row[name];?></td>  <td width="20%"><?php echo $row[sex];?></td>  <td width="20%"><?php echo $row[nation];?></td>  <td width="20%"><?php echo $row[number];?></td>  <td width="20%">操作</td>  </tr>  <?php      }  ?></tbody></table></div>


[解决办法]
你这个好像是设置td的宽度等于滚动条宽度.

用下面的代码试试, 可能不用用于所有浏览器, 兼容性问题.

<script type="text/javascript">
window.onload=risehead;
window.onresize=risehead;
function risehead(){
var th=document.getElementsByTagName("table")[0];
var tc=document.getElementsByTagName("table")[1];
th.width=tc.clientWidth;
}
</script>

读书人网 >CSS

热点推荐