html base標籤怎麼用? html base標籤的用法總結

寻∝梦
發布: 2018-09-05 11:39:12
原創
4092 人瀏覽過

這篇文章主要的講述了關於html base標籤的用法介紹,還有關於html base標籤的具體用法實例解析,接下來就讓我們一起來看這篇文章吧

首先我們先認識下html base標籤:

標籤為頁面上的所有連結規定預設位址或預設目標。

通常情況下,瀏覽器會從目前文件的URL中提取對應的元素來填寫相對URL中的空白。

使用標籤可以改變這一點。瀏覽器隨後將不再使用目前文件的URL,而使用指定的基本URL來解析所有的相對URL。這其中包括html base標籤怎麼用? html base標籤的用法總結

標籤中的網址。

註解:標籤必須位於head元素內部。

還有html base標籤屬性的介紹:

html base標籤怎麼用? html base標籤的用法總結

#我們現在來看看實例:

<head>
<base href="http://www.php.cn/" />
<base target="_blank" />
</head>
<body>
<img  src="eg_smile.gif" / alt="html base標籤怎麼用? html base標籤的用法總結" >
<a href="http://www.php.cn">PHP中文网</a>
</body>
登入後複製

知道這些程式碼的效果嗎?現在就一起來看看在瀏覽器中現實的效果吧:

html base標籤怎麼用? html base標籤的用法總結

由於我沒輸入正確的圖片路徑,所以顯示出來的就是這個效果,大家可以輸入正確的路徑看看。

現在來看看HTML base標籤的用法:

base標記是一個基底連結標記,是一個單一標記。用以改變文件中所有連結標記的參數內定值。它只能應用於標記與之間。

你網頁上的所有相對路徑在連結時都會在前面加上基底連結指向的位址。

base 元素可規定頁面中所有連結的基準 URL

我們可以使用 標籤中的href屬性來設置,所有的「相對基準 URL」。

這是JSP端的程式碼

採用了html檔案中的標籤:

程式碼如下:

<%
String path = request.getContextPath();
// 获得项目完全路径(假设你的项目叫myWork,那么获得到的地址就是 http://localhost:12138/myhtml/):
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
// 将 "项目路径basePath" 放入pageContext中
%>
<html>
<head>
<base href=" <%=basePath%>">
//base只能应用于标记<head>与</head>之间
</head>
// 这里我们就可以直接使用相对路径(即: 相对于base标签)
<a href="jsp/login.jsp">Login </a>
</html>
登入後複製

當我們去執行上面的那段JSP程式碼後,我們可以在瀏覽器中可以查看,他所回傳給客戶端的html程式碼:

執行完上述JSP後,所回傳的html程式碼如下:

<html>
<head>
<base href="http://localhost:12138/myhtml/">
</head>
//设置了<base>后,相对路径,相对于的就是base中的路径,而不再是浏览器地址的请求路径啦~~~
<a href="jsp/login.jsp">Login </a>
</html>
登入後複製

我們可以看到JSP回傳的html程式碼中,包含了內容。

也就是說,在本html檔案中,遇到的所有“相對連結(例如:)”,都是相對於base的路徑(即:http://localhost:12138/myhtml/)

好了,以上就是這篇關於html base 標籤的用法介紹了(想看更多HTML知識,歡迎來到PHP中文網html影片教學),有問題的可以在下方提問。

【小編推薦】

html input標籤的屬性有哪些? input標籤的用法總結(附實例)

html中的label標籤怎麼設定高度? label標籤的使用方法介紹

#

以上是html base標籤怎麼用? html base標籤的用法總結的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板