HTML页面-页眉和页脚-冗余

Question

我正在创建一个具有4个链接的HTML / CSS页面，

Home.html
Details.html
ContactMe.html
AboutUs.html

我想在所有关联的HTML页面中将其保留为Header。

该页面还有一个页脚，其中包含标语句子。

如何避免在所有HTML页面中编码页眉和页脚。

谢谢！

Answer 1

请参阅： http : //www.w3schools.com/php/php_includes.asp，其中有一些简单的PHP脚本编写示例

Answer 2

如果可以使用PHP（我建议），则只需添加头文件即可：

例如。 index.php：

<html> 
   <head>
   </head>
   <body>
       <header>
          <? include('header.html'); ?>
       </header>
   </body>
</html>

如果必须严格使用HTML，则可以使用jQuery加载HTML内容

例如。 index.html：

<html> 
    <head> 
        <script src="jquery.js"></script> 
        <script> 
            $(function(){
                $("header").load("header.html");
            });
        </script>
    </head>

    <body> 
        <header></header>
    </body>
</html>

更新：

在header.html中，您可以将菜单作为ul列表

<ul>
    <li><a href="Home.html">Home</a></li>
    <li><a href="Details.html">Details</a></li>
    <li><a href="ContactMe.html">Contact Me</a></li>
    <li><a href="AboutUs.html">About Us</a></li>
</ul>

HTML页面-页眉和页脚-冗余

问题描述

2 个解决方案

解决方案1
0 2014-12-06 21:24:08

解决方案2
0 2014-12-06 21:26:56

HTML页面-页眉和页脚-冗余

问题描述

2 个解决方案

解决方案1 0 2014-12-06 21:24:08

解决方案2 0 2014-12-06 21:26:56

解决方案1
0 2014-12-06 21:24:08

解决方案2
0 2014-12-06 21:26:56