如何連結網站中的兩個頁面

在本指南中，您將學習如何使用基本 HTML 連結網站上的兩個頁面。連結頁面允許使用者輕鬆地在網站的不同部分之間導航。讓我們開始吧！

1. 建立兩個 HTML 文件 首先，建立兩個要連結的 HTML 檔案。例如，讓我們建立一個名為index.html（您的主頁）和另一個名為about.html（您的關於頁面）。

每個檔案的 HTML 可能如下所示：

index.html:

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home Page</title>


    <h1 id="Welcome-to-the-Home-Page">Welcome to the Home Page</h1>
    <p><a href="about.html">Go to About Page</a></p>

about.html：

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>About Page</title>


    <h1 id="About-Us">About Us</h1>
    <p><a href="index.html">Go to Home Page</a></p>

2. 連結頁面

為了連接兩個頁面，我們使用 HTML 中的標籤，它定義了一個超連結。標籤內的 href 屬性指定要連結的檔案的路徑。

例如：

<a href="about.html">Go to About Page</a>

在此範例中，按一下連結後，使用者將前往 about.html 頁面。

同樣，在「關於」頁面上，您可以使用以下方式建立返回主頁的連結：

<a href="index.html">Go to Home Page</a>

1. 文件結構 為了使這些連結正常工作，這兩個文件應位於同一資料夾中。如果您的 HTML 檔案位於不同的資料夾中，則需要在 href 屬性中指定正確的檔案路徑。

如果兩個檔案位於同一資料夾中，您的檔案結構應如下所示：

/website-folder
   ├── index.html
   ├── about.html

如果檔案位於不同的資料夾中，請調整 href 屬性以反映正確的路徑。

1. 測試連接 設定連結後，在 Web 瀏覽器中開啟 index.html 檔案。您將看到一個鏈接，可將您帶到“關於”頁面。當您單擊它時，它應該導航到 about.html。同樣，在「關於」頁面上，按一下連結應返回主頁。

結論
這樣您就可以使用 HTML 輕鬆連接網站上的兩個頁面。這是建立網站的基本步驟，確保使用者順利導航。快樂編碼！

以上是如何連結網站中的兩個頁面的詳細內容。更多資訊請關注PHP中文網其他相關文章！