在HTML设计中插入页面 [英] Insert Page in html design
问题描述
我设计了一个网站20页,菜单和标题有css设计我的问题是,如果我改变菜单内容,那么我必须改变所有的页面,如何使单独的页面的标题。 p>
我已经尝试过并包含网页方法,但不工作。
代码段:
<!DOCTYPE html>
< html class =no-bgpositionxyxmlns =http://www.w3.org/1999/xhtmllang =en>
< head>
< meta http-equiv =Content-Typecontent =text / html; charset = UTF-8>
< meta http-equiv =X-UA-Compatiblecontent =IE = edge>
< title>示例< / title>
< link rel =stylesheethref =css / style.csstype =text / cssmedia =screen/>
< script type =text / javascriptsrc =js / jquery-1.5.1.min.js>< / script>
< script type =text / javascriptsrc =js / custom.js>< / script>
< link rel =stylesheethref =css / nivo-slider.csstype =text / cssmedia =screen/>
< script src =js / jquery.nivo.slider.jstype =text / javascript>< / script>
< link rel =shortcut iconhref =Fav.ico>
< meta name =robotscontent =follow,index>
< link type =text / csshref =css / BodyAlign.css =stylesheetmedia =all>
< script type =text / javascriptsrc =js / Menu.js>< / script>
< script type =text / javascriptsrc =js / Menu1.js>< / script>
< script type =text / javascriptsrc =js / MenuDrop.jslanguage =javascript>< / script&
< script type =text / javascriptlanguage =javascript>
ct =us;
selURL =manufacturing.html;
$(function(){$('#popularSearches,#country-list')。hide();});
< / script>
< style media =screentype =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>首页< / a>< / li>
< li id =why_workday_menu> < a href =manufacturing.html>为什么< / a> < div style =width:200px; class =topnav_content 1-columns> < ul class =topnav_column1 last>
< li class =topnav_column_title> < a href =manufacturing.html>为什么< / a>< / li> < li> < a href =manufacturing.html>专为您的工作方式< / a>< / li> < li> < a href =manufacturing.html> Real Cloud< / a>< / li> < li> < a href =manufacturing.html>移动< / a>< / li> < div class =clearfix>< / div>
您可以使用 < object>
以非标准方式如下:
< object name =headertype =text / htmldata = header.inc.html>< / object>
也可以使用 SSI (如果您的服务器支持)。
<! - #include file =header.inc.shtml - >
如果你的html文档可以用php解析,你可以使用 include statement ..
<?php include('header.inc.phtml'); ?>
另一种方法是使用Ajax与 jQuery :
//如果你有一个容器为它的id'header-wrapper'
$('#header-wrapper')。load('header.inc.html');
// ..如果没有容器
$ .get(header.inc.html,function(data){
$(body ).prepend(data);
});
最后但同样重要的是,您可以使用Frameset或iFrame作为不良做法。
i have designed one website with 20 pages and the menu and header have the css design my problem is if i change the menu content then i have to change all the page so how to make the separate page for the header.
I have tried and include page method but not work please.
Code snippet:
<!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>
below the code is menu so i want to make separate page for below code
<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>
You can use <object>
in a non standard way like this:
<object name="header" type="text/html" data="header.inc.html"></object>
Or you can also use SSI if your server support it..
<!--#include file="header.inc.shtml" -->
If your html document can be parsed with php, you can use the include statement..
<?php include('header.inc.phtml'); ?>
Another way is to use Ajax, e.g. with 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);
});
Last but not least you can use a Frameset or a iFrame as bad practice.
这篇关于在HTML设计中插入页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!