怎么将多个html页面里引进相同的一个头部页面?

 我来答
历史的掩映
2017-12-29 · 从历史的尘埃中找寻历史的真相。
历史的掩映
采纳数:753 获赞数:26102

向TA提问 私信TA
展开全部
  • 将多个html页面里引进相同的一个头部页面的方法如下:

  • 1. iframe 包含法。
    页头和页尾分别做成一个页面,然后通过iframe嵌入到调用的页面。这种方法在页头页尾高度固定的时候比较适用,因为当页头页尾高度不固定时,需要iframe根据页面内容自适应高度,比较麻烦。
    简单代码结构示例:
    <html>
    <head>
    <title>页面</title>
    <style type="text/css">
    .page{width:950px;margin: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:950px;margin: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:950px;margin:0 auto;}  
    </style>
    </head>
    <body>
    <div class="page">
    <!--#include file="head.html" -->
    <div>页面内容</div>
    <!--#include file="foot.html" -->
    </div>
    </body>
    </html>

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式