本文主要針對HTML的head部分進行詳解，在講它之前，讓我們先對HTML文件有一個初步的認識。
HTML可以看成一棵倒立的“樹”。何謂“樹”？樹是數據樹的圖形表示形式，以父子層次結構來組織對象。
這顆“樹”由很多的標籤組成，每個成對的標籤或者獨立的標籤都是樹的節點。如圖所示，head節點是HTML節點的子節點，同時它也是meta節點和title節點的父節點。在HTML中，以標籤的嵌套形式表現節點的父子關係。
在說head之前，還要了解<!DOCTYPE>標籤。
- <!DOCTYPE> 聲明必須是 HTML 文檔的第一行，位於 <html> 標籤之前。
- 在 HTML 4 中有三種 <!DOCTYPE> 聲明。在 HTML5 中只有一種：<!DOCTYPE html>。
- HTML 4.01 基於 SGML的，需要引進DTD，總共有三種DTD類型：
| 類型 | 引入聲明 |
|---|---|
| Strict | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
| Transitional | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
| Frameset | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> |
head標籤
head標籤有meta,base,link,script,style,title等子標籤。
代碼演示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"><!--指定字符集爲utf-8 -->
<meta name="author" content="orange"><!--指定作者爲orange -->
<meta name="revised" content="orange,11/13/2018"><!--表示最後一次修改的時間 -->
<meta name="description" content="HTML文檔head標籤的說明"><!--網頁功能的描述 -->
<meta name="keywords" content="html,head,keys"><!--網頁的關鍵詞，提供給搜索引擎搜索 -->
<meta name="generator" content="Sublime Text3"><!--編輯網頁的工具 -->
<base href="" target="_blank"><!--表示在新的窗口打開鏈接 -->
<link rel="stylesheet" type="text/css" href="1.css"><!--引入外部css文件 -->
<style type="text/css">/*css代碼*/
#span_1{
background: orange
}
</style>
<script type="text/javascript">/*JavaScript代碼*/
alert('hello!我是JavaScript代碼！')
</script>
<title>第一個HTML網頁</title><!--網頁標題 -->
</head>
<body>
<span id="span_1">hello world</span>
<a href="https://www.baidu.com/">點擊我另開一個頁面跳轉到百度網</a>
</body>
</html>註釋
HTML註釋：<!-- -->
CSS和JavaScript腳本代碼註釋：//或/ /
新手上路，如有錯誤麻煩大家告訴我，謝謝！本次的學習就到此結束啦！感興趣的讀者或者想和我聊聊的請私信我，或者關注公衆號：程序員吃橘子。