html base標籤怎麼用？ base標籤的使用方法（附實例）-html教學-PHP中文網

首頁

web前端

html教學

html base標籤怎麼用？ base標籤的使用方法（附實例）

寻∝梦

Aug 27, 2018 pm 06:44 PM

base html

這篇文章主要的介紹了關於HTML base標籤的使用方法實例，其實base的用法還是挺強大的，網上都說base標籤的強大，我以前用的少，不懂這些，今天我就給大家介紹這標籤。讓你們用看看有沒有感覺很好，最後還有個關於HTML base標籤的好處。接下來讓我們一起看文章吧

這篇文章剛開始，我們介紹HTML的用法：

一、html的< ;header>標籤中使用標籤的用法：

<header>
<!-- <base> 标签为页面上的所有链接规定默认地址或默认目标。 -->
<base href = "${pageContext.request.contextPath}/" />
<base target = "_blank" />
</header>

登入後複製

這樣使用的好處是頁面中的所有連結如果使用了相對路徑，那麼就會以base標籤中規定的地址作為基礎位址，而不會使用目前文件的URL，例如這個：

<a href = "index.jsp" />

登入後複製

這裡的標籤使用的相對路徑相當於${pageContext.request.contextPath}/index.jsp;而且會以base標籤中設定的target來開啟這一連結。

要注意的是，如果要使用base標籤的href屬性，那麼這個路徑就必須以 / 結尾，否則這個路徑是無效果的。

二、在a標籤中使用base標籤的用法：

由於a標籤在一個頁面可能有多個，所以就有了多個target，為了出去冗餘。所以，用base標籤可以指定所有a以如何方式開啟跳轉連結。

html base標籤的使用方法：

在head標籤中加入。

base標籤是對所有a標籤運作的，但是當base標籤和a標籤同時存在target時，就會以a標籤的target運作。

說了這麼多，看看實例：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>base-href实验1：不设置base标签</title>
</head>
<body>
<a href="#">这是一个href属性为空的链接</a>
<br>
<a href="http://www.php.cn">这是一个href属性的绝对路径，前往http://www.php.cn，PHP中文网的链接</a>
<br>
<a href="test.html">这是一个href属性设置为相对路径（test.html）的链接</a>
</body>
</html>

登入後複製

在瀏覽器中顯示如下：