html <base>標籤的作用

admin發表於2017-10-01
此標籤雖然比較簡單,但是使用的頻率相較於其他標籤要低的多,可能有些學習者不太熟悉,下面就簡單介紹一下此標籤的作用和用法,希望能夠給初學者帶來一定的幫助。

此標籤可以為當前文件的所有連結設定基準連結,對於基準連結的理解是是關鍵點。

在網頁程式碼中一般使用相對連結連獲取一個檔案,例如:

[HTML] 純文字檢視 複製程式碼
<img src="img.jpg" />

上面程式碼是一個常見用法,其實這個連結不完整,因為在實際解析的時候瀏覽器會將這個路徑解析為絕對路徑,例如網站的url連結是http://www.softwhy.com,那麼瀏覽器就會將相對轉換為絕對地址:

[HTML] 純文字檢視 複製程式碼
<img src="http://www.softwhy.com/img.jpg" />

網站的網址就是基準連結,這是預設的,當然也可以人為的規定基準連結,那麼<base>標籤就派上用場了。

完整程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<base href="http://www.163.com">
</head>
<body>
<img src="img.jpg" />
</body>
</html>

以上程式碼通過<base>標籤將基準連結設定為網易地址,那麼這個圖片的地址就是:

[HTML] 純文字檢視 複製程式碼
http://www.163.com/img.jpg

注意:<base>標籤僅對相對地址有效,對於絕對地址是無效的。