HTML文檔的結(jié)構(gòu)

于剛剛接觸到超文本的朋友來說，最大的障礙就是用“<”和“>”闊起來的句子，我們稱之為標(biāo)簽。大多數(shù)標(biāo)簽都有自己的屬性，屬性要寫在首標(biāo)簽中，屬性用來進(jìn)一步改變現(xiàn)實(shí)的效果。各屬性之間為先后次序，屬性是可選的。屬性也可以省略而使用默認(rèn)值。格式是這樣的<標(biāo)簽名屬性1=屬性值 1 屬性2=屬性值 2 ......>。注意：標(biāo)簽和屬性不區(qū)分大小寫。

html文檔結(jié)構(gòu)由三個(gè)部分組成。

1.頭部

2.標(biāo)題

3.元標(biāo)簽

<1>大家都學(xué)過英語，一定知道頭的英語單詞是“head”。沒錯(cuò)，在html中，我們也使用head來表示文檔的頭部，即<head>...</head>。頭部位于<html>和</html>之間。

例如：<html>

<head>

</head>

</html>

<2>標(biāo)題用英語怎么說呢？title，其實(shí)網(wǎng)頁與人一樣，網(wǎng)頁的眼睛也在頭上，在<title>標(biāo)簽對內(nèi)部放入你想要看到的文字，這樣我們就能隨意操縱標(biāo)題欄的內(nèi)容了。比如：

<html>

<head>

</head>

</html>

<3>在<head> 標(biāo)簽的內(nèi)部還可以嵌套另一個(gè)重要的標(biāo)簽：<meta>這個(gè)標(biāo)簽，此標(biāo)簽用于描述html頁面文檔的屬性，如作者、日期和時(shí)間、網(wǎng)頁描述、關(guān)鍵字、頁面刷新等。例如：

TML 是什么？

表示超文本標(biāo)記語言（Hyper Text Markup Language）
描述了網(wǎng)頁的結(jié)構(gòu)
由一些列元素組成
元素告訴瀏覽器如何顯示內(nèi)容，由標(biāo)簽表示
標(biāo)簽標(biāo)記了“標(biāo)題”，“段落”，“表”等內(nèi)容
瀏覽器不顯示HTMl標(biāo)記，而是使用它們來呈現(xiàn)頁面內(nèi)容

基本結(jié)構(gòu)

<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8">
 <title>無標(biāo)題文檔</title>
 </head>
 <body>
 // 頁面源代碼內(nèi)容
 </body>
</html>

<!DOCTYPE html>，文檔聲明，位于文檔最前面位置。
<html>元素是一個(gè)HTML頁面的根元素
<head>，元素包含關(guān)于文檔的元信息
<meta>，定義文檔元數(shù)據(jù)，常用來描述當(dāng)前頁面的特性，比如文檔字符集 charset="utf-8"
<title>，元素指定該文檔的標(biāo)題
<body>，元素包含可見頁面的所有內(nèi)容

動(dòng)手小練習(xí)：

1.試著默寫HTML基本結(jié)構(gòu)

TML文檔結(jié)構(gòu)

HTML文檔，也被稱為網(wǎng)頁，包括頭部和主體兩大部分。頭部主要描述瀏覽器和搜索引擎所需要的信息，瀏覽器不會將這些信息呈現(xiàn)給訪問者；主體是文檔的正文，是網(wǎng)頁中真正要傳達(dá)的信息，這些信息將在瀏覽器窗口的正文部分呈現(xiàn)給訪問者。

HTML文檔總是以 <html> 標(biāo)簽開始，以 </html> 標(biāo)簽結(jié)束，在 <head>...</head> 標(biāo)簽之間的內(nèi)容是頭部信息，<body>...</body> 標(biāo)簽之間的內(nèi)容是主體部分，即文檔的正文。此外，還要在文檔的最開頭，通過 <!DOCTYPE> 聲明這是一個(gè)HTML文檔。如圖 1?16 所示：

html文檔結(jié)構(gòu)圖1-16 html文檔結(jié)構(gòu)

上圖告訴我們，一個(gè)HTML文檔由4個(gè)基本部分組成：

① 一個(gè)文檔聲明：<!DOCTYPE html>

② 一個(gè)html標(biāo)簽對：<html></html>

③ 一個(gè)head標(biāo)簽對：<head></head>

④ 一個(gè)body標(biāo)簽對：<body></body>

<!DOCTYPE>

<!DOCTYPE> 聲明必須是HTML文檔的第一行，位于 <html> 標(biāo)簽之前。該聲明不是HTML標(biāo)簽，它是告訴瀏覽器該HTML文檔的DTD類型（Document Type Definition，文檔類型定義）。

在HTML5之前，有多種DTD類型，分別為Transitional類型、Strict類型、Frameset類型，而不同類型對文檔標(biāo)簽嚴(yán)格程度的要求不同，并且<!DOCTYPE>的寫法非常復(fù)雜，估計(jì)也沒有人能夠完全記住這些寫法，這給開發(fā)帶來了混亂。

到HTML5之后，一切化繁為簡，只需聲明<!DOCTYPE html>即可，它就告訴瀏覽器，該文檔是一個(gè)HTML5文檔。

在線咨詢

上一篇：CSS+HTML ul li列表原點(diǎn)如何相連？
下一篇：好程序員web前端培訓(xùn)分享HTML元素強(qiáng)制不換行