HTML标签的TABLE高度怎么自适应
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了HTML标签的TABLE高度怎么自适应相关的知识,希望对你有一定的参考价值。
我现在要用一个2行2列的TABLE填满整个页面,第一行又固定高度如100px,第2行高度自适应填充完页面剩余高度。前提是页面代码的头部要有<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">声明。
之前我一加这句就TABLE高度就不能自适应了。但是我需要这句
我的代码如下:
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2" height="100px">head</td>
</tr>
<tr>
<td style="height:100%" width="200px">left</td>
<td>main</td>
</tr>
</table>
关于使用iframe标签自适应高度的使用
在ifrome内设定最小高度,(此方法只适用于页面内切换高度不一。但是会保留最大高度,返回后保持最大高度不再回到最初页面的高度)
1 <iframe id="one4" width="100%" height="1600px" src="merchant information.html" style="border:1px solid #f4f4f4;" scrolling="no" ></iframe>
将边框颜色设定为和背景颜色一致,使其更像原生页面;
scrolling取消滚动条
1 function reinitIframe(){ 2 var iframe = document.getElementById("one1"); 3 try{ 4 var bHeight = iframe.contentWindow.document.body.scrollHeight; 5 var dHeight = iframe.contentWindow.document.documentElement.scrollHeight; 6 var height = Math.max(bHeight, dHeight); 7 iframe.height = height; 8 }catch (ex){} 9 } 10 window.setInterval("reinitIframe()", 200);
改变id和前后function内的命名,可以实现自适应高度变化。
以上是关于HTML标签的TABLE高度怎么自适应的主要内容,如果未能解决你的问题,请参考以下文章