免費(fèi)AI編程助手
HTML 結(jié)構(gòu)
HTML結(jié)構(gòu)
元素和屬性用于標(biāo)記HTML文檔中的內(nèi)容。
HTML文檔是具有.html文件擴(kuò)展名的文本文件。
您可以直接從磁盤或通過Web服務(wù)器將文件加載到瀏覽器中。對(duì)于大多數(shù)html文件，您可以將其拖放到瀏覽器窗口。
結(jié)構(gòu)體
兩個(gè)元素提供了HTML文檔的外部結(jié)構(gòu):
- DOCTYPE element
- html element
以下代碼顯示了Web文檔的基本結(jié)構(gòu)。
<!DOCTYPE HTML> <html> <!-- elements go here --> </html>
DOCTYPE 元素告訴瀏覽器它正在處理一個(gè)HTML文檔。這通過HTML布爾屬性表示:
<!DOCTYPE HTML>
html的開始標(biāo)記位于DOCTYPE元素之后。
HTML文檔是包含html標(biāo)簽的文本文件。HTML文檔中的HTML標(biāo)記標(biāo)記網(wǎng)頁。
將以下內(nèi)容保存到名為index.htm的文本文件，然后將其拖放到瀏覽器。
<!DOCTYPE HTML>
<html>
<body>
<h1>My Heading</h1>
<p>My paragraph</p>
</body>
</html>HTML文檔以<！DOCTYPE HTML>開頭。<！DOCTYPE HTML> 告訴瀏覽器這是一個(gè)html文檔。
<html> 和</html> 之間的內(nèi)容標(biāo)記網(wǎng)頁。<body> 和</body> 標(biāo)記可見的網(wǎng)頁內(nèi)容。<h1> 和</h1> 用于定義標(biāo)題。<p> 和</p> 創(chuàng)建段落。
HTML元數(shù)據(jù)
HTML文檔中的元數(shù)據(jù)提供了有關(guān)文檔的信息。
元數(shù)據(jù)包含在head元素中。
<!DOCTYPE HTML>
<html>
<head>
<!-- define your metadata here -->
<title>web document title</title>
</head>
</html>
上面代碼中的 title 元素是元數(shù)據(jù)。
大多數(shù)瀏覽器在瀏覽器中顯示title元素窗口標(biāo)題欄或顯示頁面的選項(xiàng)卡頂部。
head 元素也定義了與外部的關(guān)系資源(如CSS樣式表)，定義內(nèi)聯(lián)CSS樣式和定義和加載腳本。
HTML Body
通過 body 元素添加html文檔的內(nèi)容。
下面的代碼將一行文本添加到body元素。
<!DOCTYPE HTML>
<html>
<head>
<!-- metadata goes here -->
<title>Example</title>
</head>
<body>
This is the <code>content</code>.
</body>
</html>在 body 標(biāo)記中的內(nèi)容中渲染的內(nèi)容。
父元素與子元素
HTML元素定義與HTML文檔中其他元素的關(guān)系。
包含另一個(gè)元素的元素是第二個(gè)元素的父級(jí)。
<!DOCTYPE HTML>
<html>
<head>
<!-- metadata goes here -->
<title>Example</title>
</head>
<body>
This is the <code>content</code>.
</body>
</html>
body 元素是code元素的父代，因?yàn)?code> code 元素包含在開始之間和 body 元素的結(jié)束標(biāo)記。
code 元素是 body 元素的子元素。
元素可以有多個(gè)子元素，但只能有一個(gè)父元素。
后代
html 元素包含 body 元素，其中包含code元素。
body 和code元素是 html 元素的后代。
只有 body 元素是 html 元素的子元素。
孩子是直接的后代。
共享相同父元素的元素稱為兄弟元素。
head 和 body 元素是兄弟。
更多建議：