我设计了一个有 20 个页面的网站,菜单和页眉采用 CSS 设计,我的问题是如果我更改菜单内容,那么我必须更改所有页面,因此如何为页眉制作单独的页面。
我已经尝试并包含页面方法,但请不要工作。
代码片段:
<!DOCTYPE html>
<html class=" no-bgpositionxy" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>sample</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />
<script src="js/jquery.nivo.slider.js" type="text/javascript"></script>
<link rel="shortcut icon" href="Fav.ico">
<meta name="robots" content="follow,index">
<link type="text/css" href="css/BodyAlign.css" rel="stylesheet" media="all">
<script type="text/javascript" src="js/Menu.js"></script>
<script type="text/javascript" src="js/Menu1.js"></script>
<script type="text/javascript" src="js/MenuDrop.js" language="javascript"></script>
<script type="text/javascript" language="javascript">
ct = "us";
selURL = "manufacturing.html";
$(function(){$('#popularSearches,#country-list').hide();});
</script>
<style media="screen" type="text/css">
<!--
.enlarge {width:330px;bottom:55px;}
-->
</style>
</head>
<!-- Head -->
<body>
代码下面是菜单,所以我想为下面的代码制作单独的页面
<header id="header"> <div class="container"> <div id="topnav_wrap"> <ul id="topnav"> <li class="topnav_column_title"> <a href="index.html">Home</a></li>
<li id="why_workday_menu"> <a href="manufacturing.html">Why </a> <div style="width: 200px;" class="topnav_content 1-columns"> <ul class="topnav_column1 last">
<li class="topnav_column_title"> <a href="manufacturing.html">Why </a></li> <li> <a href="manufacturing.html">Designed for the Way You Work</a></li> <li> <a href="manufacturing.html">Real Cloud</a></li> <li> <a href="manufacturing.html">Mobile</a></li> <div class="clearfix"></div>
最佳答案
您可以使用 <object>
以这样的非标准方式:
<object name="header" type="text/html" data="header.inc.html"></object>
或者你也可以使用SSI如果你的服务器支持它..
<!--#include file="header.inc.shtml" -->
如果你的html文档可以用php解析,你可以使用include声明..
<?php include('header.inc.phtml'); ?>
另一种方法是使用 Ajax,例如与 jQuery :
// if you have a container for it with id 'header-wrapper'
$('#header-wrapper').load('header.inc.html');
// ..or if you have no container for it
$.get("header.inc.html", function(data) {
$("body").prepend(data);
});
最后但同样重要的是,您可以将 Frameset 或 iFrame 用作不好的做法。
关于php - 在 html 设计中插入页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18937026/