常見的HTML檔案路徑設定方式

HTML 中使用路徑可以連結其他頁面、插入圖片和嵌入樣式表等。不同檔案之間的路徑設定不同，以下是常見的 HTML 檔案路徑設定方式。

1. 相對路徑

相對路徑是相對於目前檔案所在目錄的路徑。相對路徑可以簡化程式碼，也方便進行文件管理。以下是幾種常見的相對路徑設定方式。

1.1. 連結其他頁面

要連結到同一目錄下的其他 HTML 文件，可以直接寫文件名稱即可。

<a href="page2.html">Page 2</a>

要連結到父級目錄下（上一層）的 HTML 文件，可以在文件名稱前加上兩個點「..」。

<a href="../page1.html">Page 1</a>

注意：「..」表示上一層目錄，可以使用多個點來表示多層目錄，例如「../../」表示上兩級目錄。

1.2. 插入圖片

要插入同一目錄下的圖片，可以直接寫圖片名稱即可。

<img src="image.jpg" alt="My Image">

要插入父級目錄下的圖片，可以在圖片名稱前加上兩個點「..」。

<img src="../image.jpg" alt="My Image">

1.3. 嵌入樣式表

要嵌入同一目錄下的樣式表，在 HTML 檔案中直接寫入樣式表檔案名稱即可。

<link rel="stylesheet" href="style.css">

要嵌入父級目錄下的樣式表，可以在樣式表檔案名稱前加上兩個點「..」。

<link rel="stylesheet" href="../style.css">

2. 絕對路徑

絕對路徑是從網域開始的完整路徑，可以在任何檔案中使用。以下是幾種常見的絕對路徑設定方式。

2.1. 連結其他頁面

要連結到同一網域下的其他 HTML 文件，可以直接寫連結的完整 URL。

<a href="http://www.example.com/page2.html">Page 2</a>

2.2. 插入圖片

要插入同一網域下的圖片，可以直接寫圖片的完整 URL。

<img src="http://www.example.com/image.jpg" alt="My Image">

2.3. 嵌入樣式表

要嵌入同一網域下的樣式表，在 HTML 檔案中直接寫入樣式表檔案的完整 URL。

<link rel="stylesheet" href="http://www.example.com/style.css">

注意：使用絕對路徑會使程式碼變得冗長，也會增加網頁載入時間，所以不建議過度使用。

總結

以上是 HTML 路徑設定的常見方式。相對路徑是根據目前文件所在位置來決定連結、插入圖片和嵌入樣式表的路徑，而絕對路徑則是從網域開始的完整路徑。根據具體的文件位置和需求選擇合適的路徑方式，可以簡化程式碼、方便文件管理，並提高網頁載入速度。

以上是常見的HTML檔案路徑設定方式的詳細內容。更多資訊請關注PHP中文網其他相關文章！