溫馨提示×
您好，登錄后才能下訂單哦！
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹了html標(biāo)簽中常用的頭部標(biāo)簽是什么的相關(guān)知識(shí)，內(nèi)容詳細(xì)易懂，操作簡(jiǎn)單快捷，具有一定借鑒價(jià)值，相信大家閱讀完這篇html標(biāo)簽中常用的頭部標(biāo)簽是什么文章都會(huì)有所收獲，下面我們一起來(lái)看看吧。
HTML 中的 <head> 標(biāo)簽是所有頭部標(biāo)簽的容器，這些頭部標(biāo)簽用來(lái)定義有關(guān) HTML 文檔的元數(shù)據(jù)（描述數(shù)據(jù)的數(shù)據(jù)）以及所需資源的引用（例如 CSS 樣式文件、JavaScript 腳本文件），對(duì)文檔能夠在瀏覽器中正確顯示起到了非常重要的作用。根據(jù)我們的需求，可以在 HTML 頭部定義大量的元數(shù)據(jù)，也可以定義很少或者根本就不定義。雖然頭部標(biāo)簽是 HTML 文檔的一部分，但其中的內(nèi)容并不會(huì)顯示在瀏覽器中。
在 <head> 標(biāo)簽中可以使用的頭部標(biāo)簽有 <title>、<base>、<link>、<style>、<meta>、<script> 和 <noscript> 等，下面就來(lái)簡(jiǎn)單介紹一下它們。
1、<title> 標(biāo)簽
<title> 標(biāo)簽用來(lái)定義 HTML 文檔的標(biāo)題，只有包含 <title> 標(biāo)簽的文檔才算是一個(gè)有效的 HTML 文檔。另外，一個(gè) HTML 文檔中僅允許存在一個(gè) <title> 標(biāo)簽，并且 <title> 標(biāo)簽必須放置在 <head> 標(biāo)簽中。
注意，在 <title> 標(biāo)簽內(nèi)部?jī)H允許包含純文本內(nèi)容，不能包含其他 HTML 標(biāo)簽。
<title> 標(biāo)簽的主要作用如下所示：
在瀏覽器標(biāo)題欄或者任務(wù)欄中顯示標(biāo)題；
當(dāng)將頁(yè)面添加到收藏夾（書簽）時(shí)提供標(biāo)題；
在搜索結(jié)果中顯示頁(yè)面標(biāo)題。
下面的示例演示了如何在 HTML 文檔中使用 <title> 標(biāo)簽：
<head> <meta charset="utf-8"> <title>億速云-教程_手冊(cè)_視頻-免費(fèi)php在線學(xué)習(xí)平臺(tái)</title> </head>
<title> 標(biāo)簽的內(nèi)容必須與當(dāng)前文檔有關(guān)，并且不應(yīng)該過(guò)長(zhǎng)，中文頁(yè)面請(qǐng)盡量控制在 30 個(gè)字符（包括空格）以內(nèi)。
2、<base> 標(biāo)簽
<base> 標(biāo)簽用于為頁(yè)面中所有相對(duì)鏈接指定一個(gè)基本鏈接，當(dāng)您設(shè)置了基本鏈接后，當(dāng)前頁(yè)面中的所有相對(duì)鏈接都會(huì)使用這個(gè)基本鏈接作為前綴，如下例所示：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title><base>標(biāo)簽演示</title> <base href="http://kemok4.com/"> </head> <body> <ul> <li><a href="course.html">視頻教程</a></li> <li><a href="course/type/3.html">入門教程</a></li> </ul> </body> </html>
上面的示例中第一個(gè) <li> 標(biāo)簽中的超鏈接會(huì)被解析為“http://kemok4.com/course.html”，第二個(gè) <li> 中的超鏈接會(huì)被解析為“http://kemok4.com/course/type/3.html”。
注意，HTML 文檔中的 <base> 標(biāo)簽必須出現(xiàn)在任何引用外部資源的標(biāo)簽之前，而且一個(gè) HTML 文檔中僅允許定義一個(gè) <base> 標(biāo)簽。
3、<link> 標(biāo)簽
<link> 標(biāo)簽經(jīng)常用于引用外部 CSS 樣式表，<link> 標(biāo)簽中包含兩個(gè)主要的屬性，分別是 rel 和 href。rel 屬性用來(lái)指示引用文件的類型，href 屬性用來(lái)設(shè)置外部文件的路徑。示例代碼如下：
<head> <title>此處書寫標(biāo)題</title> <link rel="stylesheet" href="common.css"> </head>
HTML <head> 標(biāo)簽中可以包含任意數(shù)量的 <link> 標(biāo)簽。
擴(kuò)展：引用外部 CSS 樣式表有兩種，link和@import
@import在<style>標(biāo)簽中進(jìn)行聲明的
<style type="text/css">
@import url("css文件路徑");
</style>簡(jiǎn)單實(shí)例：
css外部樣式表 style.css
h2{
color:red;
}
p{
font-size:14px;
color:green;
}HTML文檔
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link type="text/css" rel="styleSheet" href="style.css" />
<!-- <style>
@import url("style.cs");
</style> -->
</head>
<body>
<h2>link標(biāo)簽或@import的應(yīng)用</h2>
<p>外部定義CSS樣式表以.CSS為擴(kuò)展名文件，然后在頁(yè)面中通過(guò)link標(biāo)簽或@import鏈接到頁(yè)面中。</p>
</body>
</html>實(shí)現(xiàn)效果：
link和@import的區(qū)別：
1、從屬關(guān)系區(qū)別
@import是 CSS 提供的語(yǔ)法規(guī)則，只有導(dǎo)入樣式表的作用；link是HTML提供的標(biāo)簽，不僅可以加載 CSS 文件，還可以定義 RSS、rel 連接屬性等。
2、加載順序區(qū)別
加載頁(yè)面時(shí)，link標(biāo)簽引入的 CSS 被同時(shí)加載；@import引入的 CSS 將在頁(yè)面加載完畢后被加載。
3、兼容性區(qū)別
@import是 CSS2.1 才有的語(yǔ)法，故只可在 IE5+ 才能識(shí)別；link標(biāo)簽作為 HTML 元素，不存在兼容性問(wèn)題。
4、DOM可控性區(qū)別
可以通過(guò) JS 操作 DOM ，插入link標(biāo)簽來(lái)改變樣式；由于 DOM 方法是基于文檔的，無(wú)法使用@import的方式插入樣式。
4、<style>標(biāo)簽
使用 <style> 標(biāo)簽可以在 HTML 文檔中嵌入 CSS 樣式，需要注意的是在 <style> 標(biāo)簽中定義的樣式僅對(duì)當(dāng)前 HTML 文檔有效。示例代碼如下：
<head>
<title>此處書寫標(biāo)題</title>
<style>
body { background-color: YellowGreen; }
h2 { color: red; }
p { color: green; }
</style>
</head>注意：對(duì)于文檔中的唯一樣式可以使用 <style> 標(biāo)簽，但對(duì)于在多個(gè)文檔中通用的樣式，使用外部樣式表更為合適。
5、<meta> 標(biāo)簽
<meta> 標(biāo)簽用于提供有關(guān) HTML 文檔的元數(shù)據(jù)，例如頁(yè)面有效期、頁(yè)面作者、關(guān)鍵字列表、頁(yè)面描述等信息。<meta> 標(biāo)簽定義的數(shù)據(jù)并不會(huì)顯示在頁(yè)面上，但卻會(huì)被瀏覽器解析。
1) 定義字符集
<meta charset="UTF-8">
charset 屬性用來(lái)指定 HTML 文檔的字符編碼，上面的示例中，我們將文檔的字符編碼設(shè)置為了“UTF-8”。
2) 定義頁(yè)面描述
<meta name="description" content="億速云提供大量免費(fèi)、原創(chuàng)、高清的php視頻教程，并定期舉行公益php培訓(xùn)！可邊學(xué)習(xí)邊在線修改示例代碼，查看執(zhí)行效果！php從入門到精通，一站式php自學(xué)平臺(tái)！">
定義頁(yè)面的描述信息有利于搜索引擎的搜索。
<title> 標(biāo)簽定義文檔標(biāo)題，name="description" 定義文檔描述，描述的長(zhǎng)度通常大于標(biāo)題。
3) 定義關(guān)鍵字
<meta name="keywords" content="php教程,php入門教程,php視頻教程,php源碼下載,php手冊(cè)">
關(guān)鍵字用于為搜索引擎提供與頁(yè)面有關(guān)的信息。
4) 定義頁(yè)面作者
<meta name="author" content="億速云">
通過(guò)某些內(nèi)容管理系統(tǒng)可以自動(dòng)提取作者信息。
5) 刷新頁(yè)面
<meta http-equiv="refresh" content="30">
上例中的代碼用于向?yàn)g覽器發(fā)送一個(gè)指令，使瀏覽器在經(jīng)過(guò)指定的時(shí)間間隔（30 秒）后自動(dòng)刷新頁(yè)面。在 content 屬性中除了可以指定時(shí)間間隔外，還可以再指定一個(gè)鏈接，這時(shí)頁(yè)面將在指定的時(shí)間后重定向到鏈接所指向的頁(yè)面，如下例所示：
<meta http-equiv="refresh" content="10; url=http://kemok4.com/">
6、<script> 標(biāo)簽
<script> 標(biāo)簽用于定義 JavaScript 腳本
通過(guò)script標(biāo)簽嵌入JavaScript 腳本代碼或鏈入腳本文件
示例代碼如下：
<head>
<title>億速云</title>
<script>
document.write("億速云")
</script>
</head><head> <script src="js/test.js"></script> </head>
7、<noscript> 標(biāo)簽
當(dāng)用戶的瀏覽器不支持 JavaScript 腳本或者禁用 JavaScript 腳本時(shí)，可以在 <noscript> 標(biāo)簽中定義一些內(nèi)容來(lái)替代不能運(yùn)行的 JavaScript 腳本或者給用戶一些提示。除了 <script> 標(biāo)簽外，在 <noscript> 標(biāo)簽中可以包含任何 HTML 元素，如下例所示：
<head> <title>億速云</title> <noscript> <p>您的瀏覽器不支持 JavaScript 或者您禁用了 JavaScript，請(qǐng)<a href="http://kemok4.com/">點(diǎn)擊這里</a>了解如何啟用 JavaScript。</p> </noscript> </head>
關(guān)于“html標(biāo)簽中常用的頭部標(biāo)簽是什么”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對(duì)“html標(biāo)簽中常用的頭部標(biāo)簽是什么”知識(shí)都有一定的了解，大家如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號(hào)
手機(jī)網(wǎng)站二維碼