html中使用include引入另一个html文件

<!--#include file="top.html"-->不可以放到普通html页面,这是一个asp脚本,是server script。只有在asp/jsp中才能起作用。

如果要在html静态页面中使用include,则需要借助nginx服务且需要开启ssi 服务才能生效。

在nginx配置文件nginx.conf的http标签开启ssi:

http{

......

ssi on;

ssi_silent_errors on;

ssi_types text/shtml;

}

index.html引入header.html和footer.html文件:

如index.html内容:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<link rel="shortcut icon" href="/html/images/ico/favicon-16.ico">

<title>fei8meng</title>

<link rel="stylesheet" type="text/css" href="/html/css/main.css">

</head>

<body>

<!-- 切记include的#前不能有空格 -->

<!--#include file="/html/public/header.html"-->

<div class="content">

内容

</div>

<!--#include file="/html/public/footer.html"-->

</body>

</html>

 

header.html文件内容:

<!-- 防止乱码 -->
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
<!-- 头部 -->
<div class="header">
    头部内容
</div>

 

footer.html文件内容:

<!-- 防止乱码 -->
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
<!-- 底部 -->
<div class="footer">
    底部内容
</div>
 

 

 

  • 6
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值