如何保持網頁頂部分開的內容

我是超新手在HTML/CSS /無論在網絡和我想建立自己的網站。假設我的網站有兩個部分 - 頂部帶有徽標和菜單，底部帶有內容。我需要哪些工具來分開保存？我的意思是 - 只有一個文件帶有'上面的東西'（因爲我不想在每個子頁面上編輯它）和其他帶有子頁面的文件？我需要php嗎？如何保持網頁頂部分開的內容

對我而言，使用是件好事嗎？

來源

2013-04-03 hugerth

服務器端語言如PHP是要走的路。服務器端語言將使您能夠執行所謂的server side include。

因此，例如，您可以創建一個名爲header.php的文件，並將所有代碼從開頭的<html>標記放置到您的網站頂部不變的任何其他位置。您可能需要更進一步，並創建一個footer.php以將所有代碼始終放在最底部。

例的header.php

<!doctype html> 
<html> 
<head> 
    <title>My Awesome Website</title> 
</head> 
<body> 
    <header> 
     <nav> 
      <ul> 
       <li>Menu Link 1</li> 
       <li>Menu Link 2</li> 
       <li>Menu Link 3</li> 
      </ul> 
     </nav> 
    </header> 
    <div id="main">

例footer.php

</div><!-- end #main --> 
    <footer> 
     My Awesome website's Footer content! 
    </footer> 
</body> 
</html>

我們把它們放在一起我們的網頁上或index.php

例的index.php

<?php include 'header.php'; ?> 

    <h1>Welcome to my home page!</h1> 
    <p>This is my super awesome site and I hope you like it!</p> 

<?php include 'footer.php'; ?>

發送到瀏覽器的最終輸出將是如下：

<!doctype html> 
<html> 
<head> 
    <title>My Awesome Website</title> 
</head> 
<body> 
    <header> 
     <nav> 
      <ul> 
       <li>Menu Link 1</li> 
       <li>Menu Link 2</li> 
       <li>Menu Link 3</li> 
      </ul> 
     </nav> 
    </header> 
    <div id="main"> 
     <h1>Welcome to my home page!</h1> 
     <p>This is my super awesome site and I hope you like it!</p> 
    </div><!-- end #main --> 
    <footer> 
     My Awesome website's Footer content! 
    </footer> 
</body> 
</html>

來源

2013-04-03 13:51:02 Jrod

你真棒的人。 – hugerth

如果你想純粹用HTML做到這一點，那麼通過iframe來做到這一點，但它並不是許多開發者最好的方式和阻止，因爲你鬆散了深層鏈接，因爲整個網站都有相同的地址。

更好的選擇是使用服務器端編程模型，如PHP，ASP.NET，紅寶石...

來源

2013-04-03 13:49:26

好的，謝謝，我會在這裏嘗試一些PHP。 – hugerth

不，你不必使用PHP這一點。如果你不想使用php，你也可以使用一般的ssi包含文件。使用PHP需要一個設置爲解析php的服務器（這是另一個話題:)。一個例子可能看起來像......

<body> 
    <div id="header"> 
    <!--#include file="includes/header.ssi"--> 
    </div> 

    <div id="menu"> 
    <!--#include file="includes/menu.ssi"--> 
    </div> 

    <div id="footer"> 
    <!--#include file="includes/footer.ssi"--> 
    </div> 
</body>

由於包括文件的路徑表明，有一個叫你的根文件夾目錄「包括」從您的SSI內容被調用。 ssi文件使用普通的html標記，任何ID或CLASSes仍然遵從你的CSS。

來源

2013-04-03 15:22:42 Redink

如何保持網頁頂部分開的內容

回答

相關問題