html里怎么引用一个html的头部

html里怎么引用一个html的头部,第1张

1、新建一个header.html头部文件

2、在你说的多个html页面引入即可

示例:index.html文件引入公用头部header.html

在index.html文件开始加入:<include file="header.html" />

file内填写的是你需要引入的文件的详细地址,可以是相对地址,也可以是绝对地址!

将多个html页面里引进相同的一个头部页面的方法如下:

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>


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/7492222.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-06
下一篇 2023-04-06

发表评论

登录后才能评论

评论列表(0条)

保存