- 網頁設計與制作全能一本通（微課版）
- 歐陽榮華 汪艷主編
- 891字
- 2024-02-23 18:09:24
1.3.1 HTML5文檔結構
HTML5文檔是純文本文件，常用的文件擴展名是.html或者.htm。HTML5文件的第一行是文檔聲明，對于HTML5文檔來說，文檔聲明如下。
<!DOCTYPE html>
因為HTML5對字母大小寫不敏感，所以以上文檔聲明也可寫作“<!DOCTYPE HTML>”。HTML5之前的HTML4.01的文檔聲明如下。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
HTML5與之前的版本相比，文檔聲明更加簡潔。
文檔聲明之后是HTML5文檔的內容。標簽是HTML5文檔內容的最小單位，標簽通常兩個為一組，一起出現，用角括號（Angle Bracket）標識標簽的位置。文檔聲明也是一個特殊的標簽。下面的代碼展示了一個標簽名為html的標簽。
<html> </html>
角括號內的“html”就是標簽的名字。一般來說，如果某個標簽的角括號內第一個字符是“/”，則這個標簽為結束標簽，否則是開始標簽。一對標簽組成一個元素。例如，<html>是開始標簽，表示html元素的開始；</html>是結束標簽，表示html元素的結束。
開始標簽和結束標簽之間是元素的內容。它可以是文本，也可以是其他標簽。另外，開始標簽中除了標簽名字外，還可以添加一個或多個屬性。HTML5文檔的基本結構如下所示。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf8" />
<title>文檔標題</title> <!-- 文檔的標題會被顯示在頁面的標題欄 -->
</head>
<body>
<!-- 通常來說<body></body>標簽內的元素才是顯示在瀏覽器窗口中的內容 -->
<h1>一級標題</h1>
<p>文本段落</p>
<h2>二級標題</h2>
<p>文本段落</p>
</body>
</html>
HTML5文檔的最開始是文檔聲明。之后的所有文檔內容都應該包含在一個html元素之內。html元素內通常有兩個子元素，即head和body。Head元素內通常包含頁面的一些信息，而body元素中包含在頁面中可以看到的內容。
上例中<head>標簽內的第一個標簽為“<meta charset="utf8" />”，其標簽名為“meta”。charset="utf8"說明標簽的charset屬性的值是“utf8”。這意味著當前HTML5文檔的編碼格式是“utf8”，這一屬性設置對于絕大多數包含中文的HTML5文檔都是必要的。若不設置該屬性，則瀏覽器可能無法正常顯示中文。
“<meta charset="utf8" />”中的“/”表明當前元素為空，“<meta />”相當于“<meta></meta>”。
在HTML5文檔中，“<!--”和“-->”是注釋符號，它們之間的內容會被忽略掉，起到對代碼進行解釋說明的作用。
下面開始創建第一個HTML5文檔。啟動VS Code。單擊“文件”菜單，選擇“新建文件”選項創建空文件。輸入上面的代碼，保存新文件為“1.3.1.html”。它是一個簡單但完整的HTML5文檔。
注意
文件名中的“.html”表示當前文件是HTML5文檔。文件名中最后一個點及其后面的部分被稱為文件的擴展名。比如Word文檔的擴展名是.doc或.docx，擴展名通常可以說明文件的類型，以及應該用什么程序打開文件。如果使用了其他的擴展名，則可能無法使用瀏覽器正常打開HTML5文檔。