网页设计;多个页面上的相同对象?

时间:2014-10-26 03:52:30

标签: php html css web-deployment

我曾经问过这个问题我道歉。我试着四处寻找,但无法找到相关答案(可能是因为我的网页设计词汇相对较小)。

我注意到大多数网站在他们的几乎所有网页上都至少有一个 - 如果不是更多 - 标准的“对象”(或者实际名称是什么)。例如,Stack Overflow在每个页面上都有相同的徽标和标签(问题,标签,用户......)。我假设除了简单地一遍又一遍地复制和粘贴相同的代码之外,还有一种不那么费力的方法来设置它,特别是当易于修改成为一个因素时。据我所知,CSS不能完成这种级别的样式泛化,所以我假设像PHP这样的服务器端语言是等式的一部分。

我并不是在寻找一个非常具体的答案。什么语言 - 或类型或语言 - 以及至少一种实现某种“对象粘贴”的方式的简要概要就足够了。

6 个答案:

答案 0 :(得分:3)

正如其他人所说,这是人们从HTML转到PHP之类的主要原因,起初只是为了分割部分页面。

是的,你可以做到这一点。我通常做的事情(如果我没有使用框架)是在我的目录中创建一个文件夹,如下所示:

inc/header.php
inc/footer.php
inc/menu.php
index.php

然后在index.php中你需要一个包括:

<? include('inc/header.php'); ?>
<h2>Welcome to my site</h2>
<p>We're happy to have you</p>
<? include('inc/footer.php'); ?>

inc/header.php

<!DOCTYPE html>
<html>
   <head>
       <title>My site</title>
   </head>
   <body>

inc/footer.php

<div id="footer">
    <h2>Thanks for visiting</h2>
</div>
</body>
</html>

inc/menu.php

然后对于您网站上的其他网页,为页眉,页脚和菜单执行相同的includes,并在包含

之间编写特定于页面的内容

答案 1 :(得分:2)

一种简单的方法是为页面的不同部分创建单独的文件,而不是在每个页面上粘贴相同的代码

include ('yourfilename.php'); 

在php文件中的yourfilename.php中添加代码。这也可以很容易地修改该部分,并使您的更改反映在使用yourfilename.php的所有页面上

例如,您可以创建一个名为page_top.php的文件,另一个名为page_bottom.php。然后在你可以包含的各种php页面上(&#39; page_top.php&#39;);靠近顶部并包含(&#39; page_bottom.php&#39;);靠近底部。然后,这些文件中的代码将在每个内容页面上执行。

当然还有其他方法,但这是一种非常简单的方法,你应该先研究一下。

答案 2 :(得分:2)

包含的一个例子是:

<强>的header.php

<!DOCTYPE html>
<html>
<head>
<stuff><stuff>
</head>
<body>
<div id="mybanner">Design and logo that is common on all pages</div>

内容/ contact.php

<div id="bulk_of_the_html">
The rest of your stuff goes here
</div>

<强> foot.php

<div id="footer_common_to_all">This is your footer content that is common to all pages</div>
</body>
</html>

使用将类似于:

<强> contact.php

// This is your common to all pages header
include("header.php");
// This can be changed up as content switches
include("content/contact.php");
// This is your common to all pages footer
include("foot.php");

答案 3 :(得分:2)

只是PHP的替代品:

使用Javascript或jQuery

$( "#footer" ).load( "includes/footer.html" );

另一种选择是使用SHTML,它基本上是带插入的HTML。

答案 4 :(得分:2)

HTML importsWebcomponents是使用HTML,JS和CSS在客户端完全执行此操作的新方法。编写一个组件并在每个页面中重用它。但是它使用ShadowDom,意味着还不能搜索索引。

<link rel="import" href="header-banner.html">
<!-- use this in body -->
<header-banner></header-banner>

答案 5 :(得分:1)

你有两个解决方案

  1. 使用include('.... php')或require('.... php')或include_once('.... php')或require_once('.... php') php函数将外部部分/模块添加到您的网页(php)中。 您可以在希望显示极值模块/部件的位置调用此函数。

      include("Header.php");   // call to external module
    
      // your body goes here
      <h1>.......</h1>
      <p>........</p>
      .....................
    
      include("Footer.php");    // again to another module
    
  2. 或者如果你可以使用MVC框架,你可以将多个模块和视图合并到一个输出页面中,那就更好了......(ex Codeignitor / Cakephp ...)