音畫(huà)網(wǎng)頁(yè)制作教學(xué)之二：第一個(gè)html文件

AAA · 發(fā)表于 2007-12-22 02:26

第一個(gè)html文件

在這里，我們先來(lái)看一個(gè)簡(jiǎn)單的html文件的范例，對(duì)其進(jìn)行解釋?zhuān)皇悄鷮?duì)之有一個(gè)感性的認(rèn)識(shí)，為以后的學(xué)習(xí)打下基??/p>

html文件是純文本文件，是用ascii碼寫(xiě)成的原文件，可以用任何一個(gè)文本編輯器（如記事本notepad）打開(kāi)和編輯。

html文件包括兩部分：

文件的內(nèi)容部分；
html的標(biāo)識(shí)部分；

大多數(shù)html表示的書(shū)寫(xiě)格式如下：

<標(biāo)識(shí)名>顯示內(nèi)容</標(biāo)識(shí)名>

瀏覽器的功能是解釋并顯示html文件。需要注意的是對(duì)同一個(gè)html文件，不同的瀏覽器顯示的效果可能不一樣。下面就給出一個(gè)html文件的例子，以便讀者對(duì)照其在瀏覽器中的顯示情況，來(lái)了解html文件的基本格式、概念和標(biāo)記。在編輯的文本文件里寫(xiě)出如下內(nèi)容（你可以使用windows子代的記事本來(lái)編寫(xiě)）：

<html>
<head>
<title>這是我的第一個(gè)html文件</title>
</head>
<body>
我今天下定決心開(kāi)始學(xué)習(xí)html，學(xué)不成功誓不罷休。
現(xiàn)在我用html標(biāo)識(shí)來(lái)顯示具體內(nèi)容。
網(wǎng)頁(yè)的具體內(nèi)容放置于該處。
</body>
</html>

然后將文件保存為后綴為.htm或者.html的文件（用"文件"菜單中的"另存為"命令，在文件名中輸入完整的文件名，如：example.htm，文件類(lèi)型中選擇"所有類(lèi)型"），用瀏覽器打開(kāi)該文件即可看到顯示效果。

這就是一個(gè)簡(jiǎn)單的html文件。

下面介紹所用的標(biāo)識(shí)：

<html></html>標(biāo)識(shí)：任何一個(gè)html文件都應(yīng)該以該標(biāo)識(shí)開(kāi)頭和結(jié)尾，該標(biāo)識(shí)告訴瀏覽器適用html語(yǔ)言來(lái)解釋和顯示該文件。其它內(nèi)容都應(yīng)寫(xiě)在該標(biāo)識(shí)之間。（注意，今后可能會(huì)經(jīng)常用到之間和內(nèi)部，之間是指開(kāi)是標(biāo)示和結(jié)尾標(biāo)識(shí)中間，如<html>本里寫(xiě)在該標(biāo)識(shí)之間</html>，內(nèi)部是開(kāi)識(shí)標(biāo)識(shí)以?xún)?nèi)書(shū)寫(xiě)特定的內(nèi)容，如<html title="超文本標(biāo)識(shí)語(yǔ)言"></html>。另外，此處的title=""是<html></html>標(biāo)是的一個(gè)屬性，而不是下面講的<title></title>標(biāo)識(shí)，標(biāo)識(shí)和屬性識(shí)兩個(gè)不同的概念，在html文件中，標(biāo)識(shí)都是以尖括號(hào)括起來(lái)的，而屬性識(shí)標(biāo)是的一部分，對(duì)標(biāo)是主體其輔助修飾作用。關(guān)于屬性，以后用到時(shí)在解釋。），請(qǐng)注意區(qū)分。
<head></head>標(biāo)識(shí)：該標(biāo)識(shí)是網(wǎng)頁(yè)頭部標(biāo)識(shí)。寫(xiě)在該標(biāo)是之間的內(nèi)容一般不顯示出來(lái)，只有后面講到的<title></title>標(biāo)識(shí)會(huì)顯示在瀏覽器頂部的藍(lán)色標(biāo)題欄中。
<title></title>標(biāo)識(shí)：該標(biāo)是放置于<head></head>標(biāo)識(shí)之間，其中間書(shū)寫(xiě)的內(nèi)容將顯示在瀏覽器的頂部標(biāo)題欄中。是一個(gè)html文件的標(biāo)題，如上例所示，標(biāo)題的內(nèi)容你可以任意制定，也可以不寫(xiě)。
<body></body>標(biāo)識(shí)：網(wǎng)頁(yè)的主題內(nèi)容應(yīng)該放置在該標(biāo)識(shí)之間，而該標(biāo)識(shí)應(yīng)該放置在<html></html>標(biāo)識(shí)之內(nèi)。

在此已經(jīng)講了四個(gè)標(biāo)識(shí)，這四個(gè)標(biāo)識(shí)的用法都很簡(jiǎn)單，就如同所舉的例子一樣即可，至于你想加入更多的內(nèi)容則只需要在<body></body>標(biāo)是之間加入相應(yīng)的內(nèi)容即可。另外標(biāo)識(shí)與標(biāo)是之間可以不換行，換行的目的是為了便于閱讀，標(biāo)識(shí)也無(wú)須區(qū)分字母的大小寫(xiě)，如寫(xiě)成<Html><hEad><TITLE>標(biāo)題</title></HEAD><body>內(nèi)容</body></html>將得到同上面相同的顯示效果，但為了便于閱讀和修改，最好統(tǒng)一用大寫(xiě)或者小寫(xiě)字母書(shū)寫(xiě)。