1. iframe 包含法。
页头和页尾分别做成一个页面，然后通过iframe嵌入到调用的页面。这种方法在页头页尾高度固定的时候比较适用，因为当页头页尾高度不固定时，需要iframe根据页面内容自适应高度，比较麻烦。
简单代码结构示例：
<html>
<head>
<title>页面</title>
<style type="text/css">
.page{width:950pxmargin:0 auto}
</style>
</head>
<body>
<div class="page">
<iframe frameboder="0" scrolling="no" width="100%" height="80" src="head.html"></iframe>
<div>页面内容</div>
<iframe frameboder="0" scrolling="no" width="100%" height="80" src="foot.html"></iframe>
</div>
</body>
</html>
2. js包含法
页头和页尾改成外接js的形式，通过documen.write输出或其它js的输出的方法。这种方法在页头页尾需要修改时，不利于修改，也不好还原原先的html结构。
<html>
<head>
<title>页面</title>
<style type="text/css">
.page{width:950pxmargin:0 auto}
</style>
</head>
<body>
<div class="page">
<script type="text/javascript" href="head.js"></script>
<div>页面内容</div>
<script type="text/javascript" href="foot.js"></script>
</div>
</body>
</html>
3. shtml方法
运用服务端的包含方法，只需在页面中使用服务端包含命令<!--# include file="文件名称" -->，在被调用的页面嵌入页头和页脚即可。但此方法需要服务端支持ssi（server side include 服务端包含）功能。
<html>
<head>
<title>页面</title>
<style type="text/css">
.page{width:950pxmargin:0 auto}
</style>
</head>
<body>
<div class="page">
<!--#include file="head.html" -->
<div>页面内容</div>
<!--#include file="foot.html" -->
</div>
</body>
</html>
制作一个共用头部文件head.htm或一个共用底部文件foot.htm。如主页文件是index.htm，调用头部和底部文件的方法是:在主页文件代码的开始位置和结束位置分别增加下面的代码:<iframe MARGINWIDTH=0 MARGINHEIGHT=0 HSPACE=0 VSPACE=0 FRAMEBORDER=0 SCROLLING=no src=”head.htm” height=120 width=1024></iframe>
<iframe MARGINWIDTH=0 MARGINHEIGHT=0 HSPACE=0 VSPACE=0 FRAMEBORDER=0 SCROLLING=no src=”foot.htm” height=120 width=1024></iframe>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）