最近做一个网站，因为头部菜单栏都是一样的嘛，所以想实现跟标题一样的效果。开始我想到的就是框架，具体实施的时候发现不行，上下两部分不能很好的结合。CSDN上问，看到一个网友的问题跟我类似，有人提示用div和iframe实现，可惜没给出具体方法。只能自己查资料，最后终于搞定呵呵 。
这里面除了div和iframe之外，还需要一段自适应高度的教本。div层就是放网页顶部的菜单栏，iframe部分是子窗体。我把主页的代码复制如下：
<html>
<head>
<title>iframe自适应加载的页面高度</title>
<script language="Javascript">
var getFFVersion=navigator.userAgent.substring
(navigator.userAgent.indexOf("Firefox")).split("/")[1]
//extra height in px to add to iframe in FireFox 1.0+ browsers
var FFextraHeight=getFFVersion>=0.1? 16 : 0
function dyniframesize(iframename) {
var pTar = null;
if (document.getElementById){
pTar = document.getElementById(iframename);
}
else{
eval('pTar = ' + iframename + ';');
}
if (pTar && !window.opera){
//begin resizing iframe
pTar.style.display="block"
if (pTar.contentDocument &&
pTar.contentDocument.body.offsetHeight){
//ns6 syntax
pTar.height =
pTar.contentDocument.body.offsetHeight+FFextraHeight;
}
else if (pTar.Document && pTar.Document.body.scrollHeight){
//ie5+ syntax
pTar.height = pTar.Document.body.scrollHeight;
}
}
}
</script> </head>
<body>
<div class="phdn" align=center>
<a href="#" target="main">资讯首页</a>
|
<a href="child1.htm" target="main">财经</a>
|
<a href="child2.htm" target="main">体育</a>
|
<a href="child3.htm" target="main">娱乐</a>
|
<a href="child4.htm" target="main">汽车</a>
|
<a href="child5.htm" target="main">房产</a>
|
<a href="child6.htm" target="main">科技</a>
|
<a href="child7.htm" target="main">访谈</a>
|
<a href="child8.htm" target="main">旅游</a>
|
<a href="child9.htm" target="main">社会</a>
|
<a href="child10.htm" target="main">社区</a>
</div>
<iframe id="myTestFrameID" name="main" onload="javascript:{dyniframesize('myTestFrameID');}"
marginwidth=0 marginheight=0 frameborder=0 scrolling=no src="child1.htm" width=100% ></iframe>
</body></html>
child.htm就是需要替换的子窗体。
其实用,<!--#include file="top.asp"-->得方法也可以，多掌握种办法也是有好处的吧。