HTML頭部詳解

更新時間：2021-03-23 17:30:38 來源：動力節(jié)點瀏覽1042次

HTML頭部顧名思義，即包含在<head>元素里面的內(nèi)容。它包含了像頁面的標題,CSS，指向自定義圖標的鏈接,元數(shù)據(jù)(描述 HTML 的數(shù)據(jù)，比如，作者，和描述文檔的重要關(guān)鍵詞), 腳本等。即以下幾類標簽:

<title>元素

<meta>元素

<link>元素

<script>元素

我們結(jié)合下面的HTML頭部標簽的結(jié)構(gòu)來詳細聊一聊HTML頭部中的各個內(nèi)容。

<!DOCTYPE html>

<html>

??<head>

????<meta charset="utf-8">

????<title>My test page</title>

??</head>

??<body>

????<p>This is my page</p>

??</body>

</html>

<head>

下面分別介紹。

1、<title>元素

我們之前已經(jīng)了解過<title>，它可以用來給 html 文檔添加一個標題。

你可能會將它和給 body 添加標題的 <h1>元素混淆，有些時候<h1>也會被稱作網(wǎng)頁標題。但是它們是不同的。

當(dāng)被加載到瀏覽器中的時候，元素 <h1> 會出現(xiàn)在頁面中 —— 通常它應(yīng)該在一個頁面中只被使用一次，它被用來標記你的頁面內(nèi)容的標題（故事的標題，新聞標題或者任何適當(dāng)?shù)姆绞剑?/p>

元素 <title> 是用來表示整個 HTML 文檔標題的元數(shù)據(jù)（不是文檔的內(nèi)容）。

被作為建議的書簽名。

被用在搜索的結(jié)果中。

2、<meta>元素

元數(shù)據(jù)就是描述數(shù)據(jù)的數(shù)據(jù)，而 HTML有一個“官方的”方式來為一個文檔添加元數(shù)據(jù)—— <meta>元素，它是一個空元素。

不能用<base>, <link>, <script>, <style> , <title>等表示的元數(shù)據(jù)信息。

有很多不同種類的<meta>元素可以被包含進<head>元素中。

1）如果設(shè)置了 name 屬性，meta 元素提供的是文檔級別（document-level）的元數(shù)據(jù)，應(yīng)用于整個頁面。

2）如果設(shè)置了 http-equiv 屬性，meta 元素則是編譯指令，提供的信息與類似命名的 HTTP 頭部相同。

3）如果設(shè)置了 charset 屬性，meta 元素是一個字符集聲明，告訴文檔使用哪種字符編碼。

4）如果設(shè)置了 itemprop 屬性，meta 元素提供用戶定義的元數(shù)據(jù)。

注意: 全局屬性 name 在<meta>元素中具有特殊的語義；另外，在同一個<meta>標簽中，name, http-equiv 或者 charset 三者中任何一個屬性存在時，itemprop屬性不能被使用。

3、<link>元素

該元素最常用于鏈接樣式表，此外也可以被用來創(chuàng)建站點圖標(比如 PC 端的“favicon”圖標和移動設(shè)備上用以顯示在主屏幕的圖標) 。

要鏈接一個外部的樣式表，你需要在你的<head>中包含一個<link>元素,

舉個例子：

增加自定義圖標

舉個例子：

4、<script>元素

實際上，把它放在文檔的尾部（在 </body>標簽之前）是一個更好的選擇，這樣可以確保在加載腳本之前瀏覽器已經(jīng)解析了 HTML 內(nèi)容（如果腳本加載某個不存在的元素，瀏覽器會報錯)。

注意：<script>元素看起來像一個空元素，但它并不是，因此需要一個結(jié)束標記。你還可以選擇將腳本放入<script>元素中，而不是指向外部腳本文件。

綜上所述，HTML頭部實際上也就涉及到了4個內(nèi)容，即<title>元素、<meta>元素，<link>元素和<script>元素。相對來說，內(nèi)容也很通俗易懂，稍加分析就不難理解。在本站的HTML教程中還有更多的HTML知識等你來學(xué)，我們對HTML技術(shù)的學(xué)習(xí)才剛剛開始。

HTML教程