HTML基礎(chǔ)教程

1、1.HTML基本概念什么是 HTML 文件？ HTML 指超文本標(biāo)簽語言。 HTML 文件是包含一些標(biāo)簽的文本文件。 這些標(biāo)簽告訴 WEB 瀏覽器如何顯示頁面。 HTML 文件必須使用 htm 或者 html 作為文件擴(kuò)展名。 HTML 文件可以通過簡單的文本編輯器來創(chuàng)建。 做個(gè)實(shí)驗(yàn)如何？第一步：如果您使用 Windows，請(qǐng)啟動(dòng)記事本。如果您使用 Mac，請(qǐng)啟動(dòng) SimpleText。（在 OSX 中請(qǐng)使用 TextEdit，并設(shè)置一下參數(shù)：在參數(shù)設(shè)置中選擇 Plain text 字體替代 Rich text 字體，然后選擇“在 HTML 文件中忽略 rich text 命令”。這一點(diǎn)很重要

2、，因?yàn)椴贿@樣的話，HTML 代碼也許不能正常工作。）第二步：鍵入以下文本： Title of page This is my first homepage. This text is bold 第三步：將這個(gè)文件存為 mypage.htm。第四步：啟動(dòng)您的瀏覽器。在瀏覽器的文件菜單中選擇“打開”或者“打開頁面”。這時(shí)會(huì)彈出一個(gè)對(duì)話框。單擊“瀏覽”或者“選擇文件”，找到您剛才創(chuàng)建的文件 - mypage.htm，選定它然后打開，現(xiàn)在您會(huì)看到對(duì)話框中有一行地址，比如：C:MyDocumentsmypage.htm。單擊確定按鈕，瀏覽器就會(huì)顯示這個(gè)頁面。例子解釋：HTML 文件中的第一個(gè)標(biāo)簽是 。這

3、個(gè)標(biāo)簽告訴瀏覽器這個(gè) HTML 文件的開始點(diǎn)。文件中最后一個(gè)標(biāo)簽是 。這個(gè)標(biāo)簽告訴您的瀏覽器，這是 HTML 文件的結(jié)束點(diǎn)。位于 標(biāo)簽和 標(biāo)簽之間的文本是頭信息。頭信息不會(huì)顯示在瀏覽器窗口中。 標(biāo)簽中的文本是文件的標(biāo)題。標(biāo)題會(huì)顯示在瀏覽器的標(biāo)題欄。 標(biāo)簽中的文本是將被瀏覽器顯示出來的文本。 和 標(biāo)簽中的文本將以粗體顯示。為什么我們要使用小寫的標(biāo)簽？我們剛才講到：HTML 標(biāo)簽對(duì)大小寫是不敏感的： 和 的作用的相同的。當(dāng)您在網(wǎng)上沖浪時(shí)，您會(huì)發(fā)現(xiàn)大多數(shù)教程在他們的例子中都使用大寫的 HTML 標(biāo)簽。而我們總是使用小寫。原因何在呢？如果您希望為使用下一代 HTML 而做好準(zhǔn)備，您就應(yīng)該使用小寫標(biāo)簽。

4、萬維網(wǎng)聯(lián)盟 (W3C) 的標(biāo)準(zhǔn)是：建議在 HTML 4 中使用小寫標(biāo)簽，而在 XHTML（下一代 HTML）中，必須使用小寫標(biāo)簽。HTM 還是 HTML 擴(kuò)展名？當(dāng)您將一個(gè) HTML 文件存盤時(shí)，您即可以使用 HTM 也可以使用 HTML 作為擴(kuò)展名。我們剛才使用了 .htm 作為上面那個(gè)例子的擴(kuò)展名。不過這樣做也許是一個(gè)壞習(xí)慣，習(xí)慣于這樣做的人也許是因?yàn)槭褂媚承┻^時(shí)的軟件而養(yǎng)成了這個(gè)壞習(xí)慣，這些軟件只允許三個(gè)字母作為擴(kuò)展名。如果您使用新近的軟件，我們認(rèn)為使用 .html 是相當(dāng)安全的做法。關(guān)于 HTML 編輯器的注意事項(xiàng):您可以使用所見即所得的編輯器而不是純文本編輯器，這樣會(huì)更輕松的編輯 H

5、TML 文件。比方說 FrontPage, Claris Home Page, 或者 Adobe PageMill。但是，如果您希望成為一名熟練的開發(fā)人員，我們強(qiáng)烈推薦您使用純文本編輯器來學(xué)習(xí)我們的HTML 基礎(chǔ)教程。常見問題（FAQ）Q：我已經(jīng)編輯了一個(gè) HTML 文件，但是瀏覽器無法顯示出結(jié)果。為什么？A：首先確定您使用了正確的文件名和擴(kuò)展名存盤，比如說 c:mypage.htm。然后看一下是否在瀏覽器中使用了同樣的文件名來打開這個(gè)文件。Q：我重新編輯了 HTML 文件，但是瀏覽器的顯示沒有任何變化。為什么？A：為了不重復(fù)讀取同一個(gè)頁面，瀏覽器要對(duì)您的頁面進(jìn)行緩存。瀏覽器不會(huì)意識(shí)到您已經(jīng)修

6、改了頁面。通過使用刷新或者重載按鈕，您可以使瀏覽器讀取編輯后的頁面。Q：我應(yīng)該使用何種瀏覽器？A：您可以使用任何一款通用瀏覽器進(jìn)行訓(xùn)練，例如 Internet Explorer, Mozilla, Netscape,或者 Opera。不過，我們的高級(jí)課程中的某些例子需要最新版本的瀏覽器的支持。Q：我的電腦必須運(yùn)行 Windows 嗎？使用 Mac 機(jī)可以嗎？A：您可以在非 Windows 系統(tǒng)上進(jìn)行所有的訓(xùn)練，比如 Mac。2.HTML 元素HTML 標(biāo)簽 HTML 標(biāo)簽是用來標(biāo)記 HTML 元素的。 HTML 標(biāo)簽被 符號(hào)包圍。 這些包圍的符號(hào)叫作。 HTML 標(biāo)簽是成對(duì)出現(xiàn)的。例如 和 。

7、 位于起始標(biāo)簽和終止標(biāo)簽之間的文本是元素的內(nèi)容。 HTML 標(biāo)簽對(duì)大小寫不敏感， 和 的作用的相同的。 HTML 元素還記得上一節(jié)中的那個(gè)例子嗎： 頁面的標(biāo)題 這是我的第一個(gè)頁面。 此文本是粗體的。 這就是一個(gè) HTML 元素：此文本是粗體的。這個(gè) HTML 元素由起始標(biāo)簽 開始。這個(gè)元素的內(nèi)容是：“此文本是粗體的?！?。這個(gè) HTML 元素由終止標(biāo)簽 結(jié)尾。 標(biāo)簽的作用是定義一個(gè)顯示為粗體的 HTML 元素。這也是一個(gè) HTML 文檔： 這是我的第一個(gè)頁面。 此文本是粗體的。 這個(gè) HTML 元素開始于 標(biāo)簽，結(jié)束于 標(biāo)簽。 標(biāo)簽的作用是定義 HTML 文件中的容納 body 的 HTML 元

8、素。為什么我們要使用小寫的標(biāo)簽？我們剛才講到：HTML 標(biāo)簽對(duì)大小寫是不敏感的： 和 的作用的相同的。當(dāng)您在網(wǎng)上沖浪時(shí)，您會(huì)發(fā)現(xiàn)大多數(shù)教程在他們的例子中都使用大寫的HTML標(biāo)簽。而我們總是使用小寫。原因何在呢？如果您希望為使用下一代HTML而做好準(zhǔn)備，您就應(yīng)該使用小寫標(biāo)簽。萬維網(wǎng)協(xié)會(huì) (W3C) 的標(biāo)準(zhǔn)是：建議在 HTML 4 中使用小寫標(biāo)簽，而在 XHTML（下一代 HTML）中，必須使用小寫標(biāo)簽。基本的 HTML 標(biāo)簽HTML 中最重要的標(biāo)簽是定義標(biāo)題、段落和換行的標(biāo)簽。標(biāo)題標(biāo)題使用 至 標(biāo)簽進(jìn)行定義。 定義最大的標(biāo)題。 定義最小的標(biāo)題。This is a heading This is

9、a heading This is a heading This is a heading This is a heading This is a headingHTML 會(huì)自動(dòng)在標(biāo)題前后添加一個(gè)額外的折行。段落段落使用 標(biāo)簽進(jìn)行定義。This is a paragraph This is another paragraphHTML 會(huì)自動(dòng)在段落前后添加一個(gè)額外的空行。不要忘記關(guān)閉標(biāo)簽?zāi)赡茏⒁獾搅?，在編寫段落時(shí)可以不帶有 標(biāo)簽：This is a paragraph This is another paragraph 上面的例子在大多數(shù)瀏覽器中都可以工作，但是不要依賴這種做法。HTML 未來

10、的版本不允許省略任何結(jié)束標(biāo)簽。通過結(jié)束標(biāo)簽來關(guān)閉 HTML 是一種經(jīng)得起未來考驗(yàn)的 HTML 編寫方法。清楚地標(biāo)記某個(gè)元素在何處開始，并在何處結(jié)束，不論對(duì)您還是對(duì)瀏覽器來說，都會(huì)使代碼更容易理解。換行符當(dāng)你打算結(jié)束一行，而又不想開始一個(gè)新段落時(shí)， 標(biāo)簽就派上用場(chǎng)了。無論你將它置于何處， 標(biāo)簽都會(huì)產(chǎn)生一個(gè)強(qiáng)制的換行。This is a paragraph with line breaks 標(biāo)簽是空白標(biāo)簽，由于關(guān)閉標(biāo)簽沒有任何意義，因此它沒有類似 的終止標(biāo)簽。 還是 您會(huì)越來越多地發(fā)現(xiàn) 與 很相似。由于 沒有結(jié)束標(biāo)簽，它也就違反了未來的 HTML 的規(guī)則之一，即所有的元素都必須關(guān)閉。把這個(gè)標(biāo)簽寫為

11、 是經(jīng)得起未來考驗(yàn)的做法，XHTML 和 XML 都接受在打開的標(biāo)簽內(nèi)部來關(guān)閉標(biāo)簽的做法。HTML 注釋注釋標(biāo)簽用于在 HTML 源碼中插入注釋。注釋會(huì)被瀏覽器忽略。您可以使用注釋對(duì)您的代碼進(jìn)行解釋，這么做在以后的日子里會(huì)對(duì)您的代碼編輯產(chǎn)生幫助。注意：左括號(hào)后需要寫一個(gè)驚嘆號(hào)，右括號(hào)前就不需要了。對(duì) HTML 元素的重新認(rèn)識(shí) 每個(gè) HTML 元素都有一個(gè)元素名（比如 body、h1、p、br） 開始標(biāo)簽是被括號(hào)包圍的元素名 結(jié)束標(biāo)簽是被括號(hào)包圍的斜杠和元素名 元素內(nèi)容位于開始標(biāo)簽和結(jié)束標(biāo)簽之間 某些 HTML 元素沒有內(nèi)容 某些 HTML 元素沒有結(jié)束標(biāo)簽 基本的注意事項(xiàng) - 有益的提示當(dāng)您寫

12、 HTML 文本的時(shí)候，你永遠(yuǎn)也沒法確定這些文本在另一臺(tái)顯示器上是如何顯示的。一些人使用大顯示器，而另一些使用小的。當(dāng)用戶調(diào)整視窗的分辨率時(shí)，這些文本就會(huì)被重新格式化。所以不要通過在文本中添加空行和空格的辦法在你的編輯器中格式化文本。HTML 會(huì)裁掉文本中所有的空格。任何數(shù)量的空格都被按一個(gè)空格計(jì)數(shù)。另外，在 HTML 中，一個(gè)空行也被當(dāng)作一個(gè)空格。使用空的段落標(biāo)記 去插入一個(gè)空行是個(gè)壞習(xí)慣。用 標(biāo)簽代替它?。ǖ遣灰?標(biāo)簽去創(chuàng)建列表。不要著急，您將在稍后的篇幅學(xué)習(xí)到 HTML 列表。）您也許已經(jīng)注意到了，在沒有結(jié)束標(biāo)簽 的情況下， 標(biāo)簽依然可以正常工作。不過不要這樣做！下一個(gè)版本的 HTM

13、L 將不允許忽略任何的結(jié)束標(biāo)簽。HTML 會(huì)自動(dòng)地在某些元素前后添加一個(gè)額外的空行，比如段落、標(biāo)題元素前后。使用水平線 ( 標(biāo)簽) 來分隔文章中的小節(jié)是一個(gè)辦法（但并不是唯一的辦法）。基本的 HTML 標(biāo)簽標(biāo)簽描述定義 HTML 文檔。定義文檔的主體。 to 定義標(biāo)題 1 至標(biāo)題 6。定義段落。插入折行。定義水平線。定義注釋。HTML 屬性屬性為 HTML 元素提供附加信息。HTML 標(biāo)簽的屬性HTML 標(biāo)簽擁有屬性。屬性為 HTML 元素提供附加信息。屬性總是以名稱/值對(duì)的形式出現(xiàn)，比如：name=value屬性總是在 HTML 元素的開始標(biāo)簽中規(guī)定。屬性例子 1: 定義標(biāo)題的開始。 擁有關(guān)

14、于對(duì)齊方式的附加信息。TIY : 居中排列標(biāo)題屬性例子 2: 定義 HTML 文檔的主體。 擁有關(guān)于背景顏色的附加信息。TIY : 背景顏色屬性例子 3: 定義 HTML 表格。（您將在稍后的章節(jié)學(xué)習(xí)到更多有關(guān) HTML 表格的內(nèi)容） 擁有關(guān)于表格邊框的附加信息。使用小寫屬性屬性和屬性值對(duì)大小寫敏感。不過，萬維網(wǎng)聯(lián)盟在其 HTML 4 推薦標(biāo)準(zhǔn)中推薦小寫的屬性/屬性值，而 XHTML 要求使用小寫屬性/屬性值。始終為屬性值加引號(hào)屬性值應(yīng)該始終被包括在引號(hào)內(nèi)。雙引號(hào)是最常用的，不過使用單引號(hào)也沒有問題。在某些個(gè)別的情況下，比如屬性值本身就含有雙引號(hào)，那么您必須使用單引號(hào)，例如：name=John

15、 ShotGun NelsonHTML 文本格式化HTML 可定義很多供格式化輸出的元素，比如粗體和斜體字。下面有很多例子，您可以親自試試：如何查看 HTML 源碼您是否有過這樣的經(jīng)歷，當(dāng)你看到一個(gè)很棒的站點(diǎn)，你會(huì)很想知道開發(fā)人員是如何將它實(shí)現(xiàn)的？你有沒有看過一些網(wǎng)頁，并且想知道它是如何做出來的呢？要揭示一個(gè)網(wǎng)站的技術(shù)秘密，其實(shí)很簡單。單擊瀏覽器的“查看”菜單，選擇“查看源文件”即可。隨后你會(huì)看到一個(gè)彈出的窗口，窗口內(nèi)就是實(shí)際的 HTML 代碼。文本格式化標(biāo)簽標(biāo)簽描述定義粗體文本。定義大號(hào)字。定義著重文字。定義斜體字。定義小號(hào)字。定義加重語氣。定義下標(biāo)字。定義上標(biāo)字。定義插入字。定義刪除字。不

16、贊成使用。使用 代替。不贊成使用。使用 代替。不贊成使用。使用樣式（style）代替?！坝?jì)算機(jī)輸出”標(biāo)簽標(biāo)簽描述定義計(jì)算機(jī)代碼。定義鍵盤碼。定義計(jì)算機(jī)代碼樣本。定義打字機(jī)代碼。定義變量。定義預(yù)格式文本。不贊成使用。使用 代替。不贊成使用。使用 代替。不贊成使用。使用 代替。引用、引用和術(shù)語定義標(biāo)簽描述定義縮寫。定義首字母縮寫。定義地址。定義文字方向。定義長的引用。定義短的引用語。定義引用、引證。定義一個(gè)定義項(xiàng)目。HTML 字符實(shí)體諸如 “” 之類的符號(hào)在HTML中擁有特殊的含義，所以在文本中使用它們。為了在 HTML 中顯示小于號(hào) ()，我們需要使用字符實(shí)體。字符實(shí)體一些字符在 HTML 中擁

17、有特殊的含義，比如小于號(hào) () 用于定義 HTML 標(biāo)簽的開始。如果我們希望瀏覽器正確地顯示這些字符，我們必須在 HTML 源碼中插入字符實(shí)體。字符實(shí)體有三部分：一個(gè)和號(hào) (&)，一個(gè)實(shí)體名稱，或者 # 和一個(gè)實(shí)體編號(hào)，以及一個(gè)分號(hào) (;)。要在 HTML 文檔中顯示小于號(hào)，我們需要這樣寫：< 或者 使用實(shí)體名稱而不是實(shí)體編號(hào)的好處在于，名稱相對(duì)來說更容易記憶。而這么做的壞處是，并不是所有的瀏覽器都支持最新的實(shí)體名稱，然而幾乎所有的瀏覽器對(duì)實(shí)體編號(hào)的支持都很好。注意：實(shí)體對(duì)大小寫敏感?？崭窨崭袷?HTML 中最普通的字符實(shí)體。通常情況下，HTML 會(huì)裁掉文檔中的空格。假如你在文檔中連續(xù)輸

18、入 10 個(gè)空格，那么 HTML 會(huì)去掉其中的9個(gè)。如果使用  ，就可以在文檔中增加空格。最常用的字符實(shí)體顯示結(jié)果描述實(shí)體名稱實(shí)體編號(hào)空格 大于號(hào)>&和號(hào)&引號(hào)"撇號(hào) ' (IE不支持)其他一些常用的字符實(shí)體顯示結(jié)果描述實(shí)體名稱實(shí)體編號(hào)分¢鎊£日?qǐng)A¥節(jié)§版權(quán)©注冊(cè)商標(biāo)®乘號(hào)×除號(hào)÷HTML 鏈接HTML 使用超級(jí)鏈接與網(wǎng)絡(luò)上的另一個(gè)文檔相連。錨標(biāo)簽和 Href 屬性HTML 使用 （錨）標(biāo)簽來創(chuàng)建連接另一個(gè)文檔的鏈接。錨可以指向網(wǎng)絡(luò)上的任何資源：一張 HTM

19、L 頁面，一幅圖像，一個(gè)聲音或視頻文件等等。創(chuàng)建錨的語法：Text to be displayed 用來創(chuàng)建錨。href 屬性用于定位需要鏈接的文檔，錨的開始標(biāo)簽和結(jié)束標(biāo)簽之間的文字被作為超級(jí)鏈接來顯示。這個(gè)錨定義了指向 86w3 的鏈接：a href= 86w3!上面的這行在瀏覽器中顯示為這樣：Visit 86w3!Target 屬性使用 Target 屬性，你可以定義被鏈接的文檔在何處顯示。下面的這行會(huì)在新窗口打開文檔：Visit 86w3!錨標(biāo)簽和 Name 屬性Name 屬性用于創(chuàng)建被命名的錨（named anchors）。當(dāng)使用命名錨（named anchors）時(shí)，我們可以創(chuàng)建直接

20、跳至頁面中某個(gè)節(jié)的鏈接，這樣使用者就無需不停的滾動(dòng)頁面來尋找他們需要的信息。以下是命名錨的語法：Text to be displayedname 屬性用于創(chuàng)建命名錨。錨的名稱可以是任何你喜歡的名字。下面這行定義了命名錨：Useful Tips Section你會(huì)注意到，命名錨會(huì)以特殊的方式來顯示。將 # 符號(hào)和錨名稱添加到 URL 的末端，就可以直接鏈接到 tips 這個(gè)節(jié)，就像這樣：a href= Jump to the Useful Tips Section 從文件 html_links.asp 內(nèi)部鏈接到 Useful Tips 節(jié)的超級(jí)鏈接是這樣的：基本的注意事項(xiàng) - 有用的提示：總是

21、將正斜杠添加到子文件夾。假如你這樣書寫鏈接的話：href= HTTP 請(qǐng)求。這是因?yàn)榉?wù)器會(huì)添加正斜杠到這個(gè)地址，然后創(chuàng)建一個(gè)新的請(qǐng)求，就像這樣：href= 命名錨經(jīng)常被用在長的文檔中創(chuàng)建目錄?？梢詾槊總€(gè)章節(jié)賦予一個(gè)命名錨，然后連接到這些錨的鏈接被置于文檔的上部。假如瀏覽器找不到已定義的命名錨，那么就會(huì)定位到文檔的頂端。不會(huì)有錯(cuò)誤發(fā)生。鏈接標(biāo)簽標(biāo)簽描述定義錨。HTML 框架通過使用框架，你可以在同一個(gè)瀏覽器窗口中顯示不止一個(gè)頁面?？蚣芡ㄟ^使用框架，你可以在同一個(gè)瀏覽器窗口中顯示不止一個(gè)頁面。每份HTML文檔稱為一個(gè)框架，并且每個(gè)框架都獨(dú)立于其他的框架。使用框架的壞處： 開發(fā)人員必須同時(shí)跟蹤更多

22、的HTML文檔 很難打印整張頁面 框架結(jié)構(gòu)標(biāo)簽（） 框架結(jié)構(gòu)標(biāo)簽（）定義如何將窗口分割為框架 每個(gè) frameset 定義了一系列行或列 rows/columns 的值規(guī)定了每行或每列占據(jù)屏幕的面積 編者注：frameset 標(biāo)簽也被某些文章和書籍譯為框架集。框架標(biāo)簽（Frame）Frame 標(biāo)簽定義了放置在每個(gè)框架中的 HTML 文檔。在下面的這個(gè)例子中，我們?cè)O(shè)置了一個(gè)兩列的框架集。第一列被設(shè)置為占據(jù)瀏覽器窗口的 25%。第二列被設(shè)置為占據(jù)瀏覽器窗口的 75%。HTML 文檔 frame_a.htm 被置于第一個(gè)列中，而 HTML 文檔 frame_b.htm 被置于第二個(gè)列中： 基本的注意

23、事項(xiàng) - 有用的提示：假如一個(gè)框架有可見邊框，用戶可以拖動(dòng)邊框來改變它的大小。為了避免這種情況發(fā)生，可以在 標(biāo)簽中加入：noresize=noresize。為不支持框架的瀏覽器添加 標(biāo)簽。重要提示：不能將 標(biāo)簽與 標(biāo)簽同時(shí)使用！不過，假如你添加包含一段文本的 標(biāo)簽，就必須將這段文字嵌套于 標(biāo)簽內(nèi)。（在下面的第一個(gè)實(shí)例中，可以查看它是如何實(shí)現(xiàn)的。）HTML 表格你可以使用 HTML 創(chuàng)建表格。表格表格由 標(biāo)簽來定義。每個(gè)表格均有若干行（由 標(biāo)簽定義），每行被分割為若干單元格（由 標(biāo)簽定義）。字母 td 指表格數(shù)據(jù)（table data），即數(shù)據(jù)單元格的內(nèi)容。數(shù)據(jù)單元格可以包含文本、圖片、列表、段

24、落、表單、水平線、表格等等。 row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 在瀏覽器顯示如下：row 1, cell 1row 1, cell 2row 2, cell 1row 2, cell 2表格和邊框?qū)傩匀绻欢x邊框?qū)傩裕砀駥⒉伙@示邊框。有時(shí)這很有用，但是大多數(shù)時(shí)候，我們希望顯示邊框。使用邊框?qū)傩詠盹@示一個(gè)帶有邊框的表格 Row 1, cell 1 Row 1, cell 2 表格的表頭表格的表頭使用 標(biāo)簽進(jìn)行定義。 Heading Another Heading row 1, cell 1 row 1, cell

25、2 row 2, cell 1 row 2, cell 2 在瀏覽器顯示如下：HeadingAnother Headingrow 1, cell 1row 1, cell 2row 2, cell 1row 2, cell 2表格中的空單元格在大多數(shù)瀏覽器中，沒有內(nèi)容的表格單元顯示得不太好。 row 1, cell 1 row 1, cell 2 row 2, cell 1 在瀏覽器顯示如下：row 1, cell 1row 1, cell 2row 2, cell 1注意：這個(gè)空的單元格的邊框沒有被顯示出來。（不過 Mozilla Firefox 可以將整個(gè)邊框顯示出來。） 為了避免這種情況

26、，在空單元格中添加一個(gè)空格占位符，就可以將邊框顯示出來。 row 1, cell 1 row 1, cell 2 row 2, cell 1   在瀏覽器中顯示如下：row 1, cell 1row 1, cell 2row 2, cell 1基本的注意事項(xiàng) - 有用的提示：, 和 很少被用到，這是由于瀏覽器對(duì)它們的支持不太好。希望這種情況在未來版本的 XHTML 中會(huì)有所改觀。如果你使用 IE5.0 或者更新的版本，可以查看在我們的XML教程中的具體例子。表格標(biāo)簽表格描述定義表格定義表格標(biāo)題。定義表格的表頭。定義表格的行。定義表格單元。定義表格的頁眉。定義表格的主體。定義表格的頁腳

27、。定義用于表格列的屬性。定義表格列的組。HTML 列表HTML 支持有序、無序和定義列表無序列表無序列表是一個(gè)項(xiàng)目的列表，此列項(xiàng)目使用粗體圓點(diǎn)（典型的小黑圓圈）進(jìn)行標(biāo)記。無序列表始于 標(biāo)簽。每個(gè)列表項(xiàng)始于 。 Coffee Milk 瀏覽器顯示如下： Coffee Milk 列表項(xiàng)內(nèi)部可以使用段落、換行符、圖片、鏈接以及其他列表等等。有序列表同樣，有序列表也是一列項(xiàng)目，列表項(xiàng)目使用數(shù)字進(jìn)行標(biāo)記。有序列表始于 標(biāo)簽。每個(gè)列表項(xiàng)始于 標(biāo)簽。 Coffee Milk 瀏覽器顯示如下：1. Coffee 2. Milk 列表項(xiàng)內(nèi)部可以使用段落、換行符、圖片、鏈接以及其他列表等等。定義列表自定義列表不僅

28、僅是一列項(xiàng)目，而是項(xiàng)目及其注釋的組合。自定義列表以 標(biāo)簽開始。每個(gè)自定義列表項(xiàng)以 開始。每個(gè)自定義列表項(xiàng)的定義以 開始。 Coffee Black hot drink Milk White cold drink 瀏覽器顯示如下：Coffee Black hot drink Milk White cold drink 定義列表的列表項(xiàng)內(nèi)部可以使用段落、換行符、圖片、鏈接以及其他列表等等。列表標(biāo)簽標(biāo)簽描述定義有序列表。定義無序列表。定義列表項(xiàng)。定義定義列表。定義定義項(xiàng)目。定義定義的描述。已廢棄。使用 代替它。已廢棄。使用 代替它。HTML 表單和輸入HTML 表單用于搜集不同類型的用戶輸入。表單表

29、單是一個(gè)包含表單元素的區(qū)域。表單元素是允許用戶在表單中（比如：文本域、下拉列表、單選框、復(fù)選框等等）輸入信息的元素。表單使用表單標(biāo)簽（）定義。 輸入多數(shù)情況下被用到的表單標(biāo)簽是輸入標(biāo)簽（）。輸入類型是由類型屬性（type）定義的。大多數(shù)經(jīng)常被用到的輸入類型如下：文本域（Text Fields）當(dāng)用戶要在表單中鍵入字母、數(shù)字等內(nèi)容時(shí)，就會(huì)用到文本域。 First name: Last name: 瀏覽器顯示如下：窗體頂端First name: Last name: 窗體底端注意，表單本身并不可見。同時(shí)，在大多數(shù)瀏覽器中，文本域的缺省寬度是20個(gè)字符。單選按鈕（Radio Buttons）當(dāng)用戶從

30、若干給定的的選擇中選取其一時(shí)，就會(huì)用到單選框。 Male Female 瀏覽器顯示如下：窗體頂端Male Female 窗體底端注意，只能從中選取其一。復(fù)選框（Checkboxes）當(dāng)用戶需要從若干給定的選擇中選取一個(gè)或若干選項(xiàng)時(shí)，就會(huì)用到復(fù)選框。 I have a bike I have a car 瀏覽器顯示如下：窗體頂端I have a bike I have a car 窗體底端表單的動(dòng)作屬性（Action）和確認(rèn)按鈕當(dāng)用戶單擊確認(rèn)按鈕時(shí)，表單的內(nèi)容會(huì)被傳送到另一個(gè)文件。表單的動(dòng)作屬性定義了目的文件的文件名。由動(dòng)作屬性定義的這個(gè)文件通常會(huì)對(duì)接收到的輸入數(shù)據(jù)進(jìn)行相關(guān)的處理。 Userna

31、me: 瀏覽器顯示如下：窗體頂端Username: 窗體底端假如你再上面的文本框內(nèi)鍵入幾個(gè)字母，并且點(diǎn)擊確認(rèn)按鈕，那么輸入數(shù)據(jù)會(huì)被傳送到名為html_form_action.asp的頁面。那一頁將顯示出輸入的結(jié)果。表單標(biāo)簽標(biāo)簽描述定義供用戶輸入的表單定義輸入域定義文本域 (一個(gè)多行的輸入控件)定義一個(gè)控制的標(biāo)簽定義域定義域的標(biāo)題定義一個(gè)選擇列表定義選項(xiàng)組定義下拉列表中的選項(xiàng)定義一個(gè)按鈕已廢棄。有代替。HTML 圖像通過使用 HTML，可以在文檔中顯示圖像。圖像標(biāo)簽（）和源屬性（Src）在 HTML 中，圖像由 標(biāo)簽定義。 是空標(biāo)簽，意思是說，它只包含屬性，并且沒有閉合標(biāo)簽。要在頁面上顯示圖像，

32、你需要使用源屬性（src）。src 指 source。源屬性的值是圖像的 URL 地址。定義圖像的語法是：URL 指存儲(chǔ)圖像的位置。如果名為 boat.gif 的圖像位于 的 images 目錄中，那么其 URL 為 瀏覽器將圖像顯示在文檔中圖像標(biāo)簽出現(xiàn)的地方。如果你將圖像標(biāo)簽置于兩個(gè)段落之間，那么瀏覽器會(huì)首先顯示第一個(gè)段落，然后顯示圖片，最后顯示第二段。替換文本屬性（Alt）alt 屬性用來為圖像定義一串預(yù)備的可替換的文本。替換文本屬性的值是用戶定義的。在瀏覽器無法載入圖像時(shí)，替換文本屬性告訴讀者她們失去的信息。此時(shí)，瀏覽器將顯示這個(gè)替代性的文本而不是圖像。為頁面上的圖像都加上替換文本屬性是

33、個(gè)好習(xí)慣，這樣有助于更好的顯示信息，并且對(duì)于那些使用純文本瀏覽器的人來說是非常有用的?；镜淖⒁馐马?xiàng) - 有用的提示：假如某個(gè) HTML 文件包含十個(gè)圖像，那么為了正確顯示這個(gè)頁面，需要加載 11 個(gè)文件。加載圖片是需要時(shí)間的，所以我們的建議是：慎用圖片。圖像標(biāo)簽標(biāo)簽描述定義圖像。定義圖像地圖。定義圖像地圖中的可點(diǎn)擊區(qū)域。HTML 背景好的背景使站點(diǎn)看上去特別棒。背景（Backgrounds） 擁有兩個(gè)配置背景的標(biāo)簽。背景可以使顏色或者圖像。背景顏色（Bgcolor）背景顏色屬性將背景設(shè)置為某種顏色。屬性值可以是十六進(jìn)制數(shù)、RGB 值或顏色名。 以上的代碼均將背景顏色設(shè)置為黑色。背景（Back

34、ground）背景屬性將背景設(shè)置為圖像。屬性值為圖像的URL。如果圖像尺寸小于瀏覽器窗口，那么圖像將在整個(gè)瀏覽器窗口進(jìn)行復(fù)制。 body background=URL可以是相對(duì)地址，如第一行代碼。也可以使絕對(duì)地址，如第二行代碼。提示：如果你打算使用背景圖片，你需要緊記一下幾點(diǎn)： 背景圖像是否增加了頁面的加載時(shí)間。小貼士：圖像文件不應(yīng)超過 10k。 背景圖像是否與頁面中的其他圖象搭配良好。 背景圖像是否與頁面中的文字顏色搭配良好。 圖像在頁面中平鋪后，看上去還可以嗎？ 對(duì)文字的注意力被背景圖像喧賓奪主了嗎？ 基本的注意事項(xiàng) - 有用的提示： 標(biāo)簽中的背景顏色（bgcolor）、背景（backgr

35、ound）和文本（text）屬性在最新的 HTML 標(biāo)準(zhǔn)（HTML4 和 XHTML）中已被廢棄。W3C 在他們的推薦標(biāo)準(zhǔn)中已刪除這些屬性。應(yīng)該使用層疊樣式表（CSS）來定義 HTML 元素的布局和顯示屬性。HTML 顏色顏色由紅色、綠色、藍(lán)色混合而成。顏色值顏色由一個(gè)十六進(jìn)制符號(hào)來定義，這個(gè)符號(hào)由紅色、綠色和藍(lán)色的值組成（RGB）。每種顏色的最小值是0（十六進(jìn)制：#00）。最大值是255（十六進(jìn)制：#FF）。這個(gè)表格給出了由三種顏色混合而成的具體效果：ColorColor HEXColor RGB#000000rgb(0,0,0)#FF0000rgb(255,0,0)#00FF00rgb(0

36、,255,0)#0000FFrgb(0,0,255)#FFFF00rgb(255,255,0)#00FFFFrgb(0,255,255)#FF00FFrgb(255,0,255)#C0C0C0rgb(192,192,192)#FFFFFFrgb(255,255,255)顏色名大多數(shù)的瀏覽器都支持顏色名集合。提示：僅僅有 16 種顏色名被 W3C 的 HTML4.0 標(biāo)準(zhǔn)所支持。它們是：aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yell

37、ow。如果需要使用其它的顏色，需要使用十六進(jìn)制的顏色值。ColorColor HEXColor Name#F0F8FFAliceBlue#FAEBD7AntiqueWhite#7FFFD4Aquamarine#000000Black#0000FFBlue#8A2BE2BlueViolet#A52A2ABrownWeb安全色數(shù)年以前，當(dāng)大多數(shù)計(jì)算機(jī)僅支持 256 種顏色的時(shí)候，一系列 216 種 Web 安全色作為 Web 標(biāo)準(zhǔn)被建議使用。其中的原因是，微軟和 Mac 操作系統(tǒng)使用了 40 種不同的保留的固定系統(tǒng)顏色（雙方大約各使用 20 種）。我們不確定如今這么做的意義有多大，因?yàn)樵絹碓蕉嗟挠?jì)

38、算機(jī)有能力處理數(shù)百萬種顏色，不過做選擇還是你自己。216 跨平臺(tái)色最初，216 跨平臺(tái) web 安全色被用來確保：當(dāng)計(jì)算機(jī)使用 256 色調(diào)色板時(shí)，所有的計(jì)算機(jī)能夠正確地顯示所有的顏色。0000000000330000660000990000CC0000FF0033000033330033660033990033CC0033FF0066000066330066660066990066CC0066FF0099000099330099660099990099CC0099FF00CC0000CC3300CC6600CC9900CCCC00CCFF00FF0000FF3300FF6600FF9900F

39、FCC00FFFF3300003300333300663300993300CC3300FF3333003333333333663333993333CC3333FF3366003366333366663366993366CC3366FF3399003399333399663399993399CC3399FF33CC0033CC3333CC6633CC9933CCCC33CCFF33FF0033FF3333FF6633FF9933FFCC33FFFF6600006600336600666600996600CC6600FF6633006633336633666633996633CC6633FF666

40、6006666336666666666996666CC6666FF6699006699336699666699996699CC6699FF66CC0066CC3366CC6666CC9966CCCC66CCFF66FF0066FF3366FF6666FF9966FFCC66FFFF9900009900339900669900999900CC9900FF9933009933339933669933999933CC9933FF9966009966339966669966999966CC9966FF9999009999339999669999999999CC9999FF99CC0099CC3399C

41、C6699CC9999CCCC99CCFF99FF0099FF3399FF6699FF9999FFCC99FFFFCC0000CC0033CC0066CC0099CC00CCCC00FFCC3300CC3333CC3366CC3399CC33CCCC33FFCC6600CC6633CC6666CC6699CC66CCCC66FFCC9900CC9933CC9966CC9999CC99CCCC99FFCCCC00CCCC33CCCC66CCCC99CCCCCCCCCCFFCCFF00CCFF33CCFF66CCFF99CCFFCCCCFFFFFF0000FF0033FF0066FF0099FF0

42、0CCFF00FFFF3300FF3333FF3366FF3399FF33CCFF33FFFF6600FF6633FF6666FF6699FF66CCFF66FFFF9900FF9933FF9966FF9999FF99CCFF99FFFFCC00FFCC33FFCC66FFCC99FFCCCCFFCCFFFFFF00FFFF33FFFF66FFFF99FFFFCCFFFFFFHTML 顏色值顏色由紅色、綠色、藍(lán)色混合而成。顏色值顏色由一個(gè)十六進(jìn)制符號(hào)來定義，這個(gè)符號(hào)由紅色、綠色和藍(lán)色的值組成（RGB）。每種顏色的最小值是 0（十六進(jìn)制：#00）。最大值是 255（十六進(jìn)制：#FF）。關(guān)閉紅色如

43、果將紅色完全關(guān)閉,綠色和藍(lán)色的組合有 65536 種（256 x 256）。打開紅色如果將紅色設(shè)置為最大值,那么仍然存在 65536 種綠色和藍(lán)色的不同組合。1600萬種不同的顏色通過計(jì)算 256 x 256 x 256，從 0 到 255 的紅色、綠色和藍(lán)色的值一共可以組合出 1600 萬種不同的顏色。大多數(shù)現(xiàn)代的顯示器有能力顯示出至少 16384 種不同的顏色。你可以查看下面的色表，你會(huì)看到當(dāng)綠色和藍(lán)色的值為零時(shí)，紅色值從 0 到 255 時(shí)的具體的顏色。如需查看基于紅色從 0 到 255 變化時(shí)的 16384 種不同的顏色，請(qǐng)單擊下面的十六進(jìn)制值或者 rgb 顏色值：Red LightHEXRGB#000000rgb(0,0,0)#080000rgb(8,0,0)#100000rgb(16,0,0)#180000rgb(24,0,0)#200000rgb(32,0,0)#280000rgb(40,0,0)#30000