11、HTML ＜head＞标签
上一節(jié)我們介紹了 HTML 的基本結(jié)構(gòu)，在 HTML 的基本結(jié)構(gòu)中，使用 標(biāo)簽來定義頭部的內(nèi)容。接下來我們一起看一下 標(biāo)簽內(nèi)部又可以放哪些內(nèi)容（或標(biāo)簽）呢？
請讀者先看一段代碼：
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="expires" content="31 Dec 2090"><title>文檔的標(biāo)題</title><link rel="stylesheet" href="url"><style></style><script src="url"></script> </head> <body> </body> </html>從這段代碼中我們可以看出，<meta>、<title>、<link>、
1. <title>標(biāo)簽
<title> 標(biāo)簽用來表示文檔的標(biāo)題，我們通過一段簡單的代碼來加以說明：
<!DOCTYPE html> <html lang="en"> <head><title>文檔的標(biāo)題</title> </head> <body> </body> </html>運行效果如下圖所示：
2. <link>標(biāo)簽
在 HTML 中，允許使用 <link> 標(biāo)簽配合 href 屬性來引用外部 CSS（Casecading Style Sheets）文件，其中 href 屬性值為外部 CSS 文件的路徑。在 CSS 章節(jié)中會詳細(xì)進行講解，這里不做過多解釋。
3. <style>標(biāo)簽
<style> 標(biāo)簽同 <link> 標(biāo)簽類似，不同的是，<link> 標(biāo)簽是引用外部 CSS 樣式文件，而 <style> 標(biāo)簽則是用來在內(nèi)部編寫 CSS 樣式。
我們建議在 <head> 標(biāo)簽中使用 <link> 或 <style> 標(biāo)簽，而不是在其他標(biāo)簽中使用。當(dāng)瀏覽器加載頁面時，會自上而下執(zhí)行代碼。如果這兩個標(biāo)簽寫的靠近下方，在加載頁面樣式時，可能會有短暫的延遲，影響用戶使用效果。
4. <script>標(biāo)簽
<script> 標(biāo)簽用來引入外部文件。與 <link> 標(biāo)簽不同的是，<script> 標(biāo)簽配合 src 屬性引入外部 JavaScript 文件，而 <link> 標(biāo)簽則是配合 href 屬性引用外部 CSS 文件。一個是使用 href，另一個是使用 src，那么它們到底有什么區(qū)別呢？
5. href與src的區(qū)別
src 是 source 的簡寫，表示來源地址，用來引入地址中的內(nèi)容。引入的內(nèi)容會嵌入到當(dāng)前標(biāo)簽所在的位置，所以瀏覽器在解析引入文件時，會停止對后續(xù)文檔的處理，直到 src 的內(nèi)容加載完畢。
href 是 Hypertext Reference 的簡寫，表示超文本引用。在使用 href 時，瀏覽器不會停止解析當(dāng)前文件。因為 href 屬性中的內(nèi)容只是與當(dāng)前頁面有關(guān)聯(lián)，然后當(dāng)前頁面對它進行一次引用。
提示：以上講到的標(biāo)簽不是必須寫在 <head></head> 里面，只是 <head> 里面可以寫入這些標(biāo)簽。例如， <script>標(biāo)簽我們就不建議寫在 <head></head> 內(nèi)部，因為瀏覽器在解析 src 的路徑時會停下對后續(xù)文檔的處理，造成頁面的短暫阻塞。
《新程序員》：云原生和全面數(shù)字化實踐50位技術(shù)專家共同創(chuàng)作，文字、視頻、音頻交互閱讀總結(jié)
以上是生活随笔為你收集整理的11、HTML ＜head＞标签的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 10、HTML的基本结构
- 下一篇： 12、HTML ＜form＞标签（表单）