【正文】 第 8章 HTML標(biāo)記語言 溫故知新 ?什么是語言？有哪些功能、用途和特點(diǎn)？ ?語言是人類最重要的交際工具。人們借助語言保存和傳遞人類文明的成果。語言是民族的重要特征之一。 ?什么是標(biāo)記語言？和編程語言有什么區(qū)別？ ?機(jī)器語言 匯編語言 高級語言 ?高級語言 機(jī)器語言？ ?區(qū)別：編譯 ?常用 HTML標(biāo)記符的層次關(guān)系是？ ?段落標(biāo)記和換行標(biāo)記的區(qū)別有哪些？什么時候用 ?標(biāo)題標(biāo)記和水平線標(biāo)記一般用于哪種類型的網(wǎng)頁設(shè)計(jì)中？ ?哪些類型的網(wǎng)頁可以直接在瀏覽器看到源代碼？ ?下載網(wǎng)頁時反應(yīng)緩慢怎么辦？ ?網(wǎng)頁設(shè)計(jì)如何快速入門？ ?DIV標(biāo)記和 SPAN標(biāo)記的作用范圍分別是？ ?22222 EEEEEE和 FFFF00分別表示什么顏色？ ?amp。amp；在網(wǎng)頁代碼中表示哪個符號？ 本章內(nèi)容 ? HTML基礎(chǔ) ? 基本標(biāo)記 ? 超鏈接 ? 表格 ? 層 ? 表單 ? 框架 HTML基礎(chǔ) ?實(shí)例 81 認(rèn)識 html ?實(shí)例 82 HTML文檔結(jié)構(gòu) 實(shí)例 81 認(rèn)識 html 一、學(xué)習(xí)目標(biāo) ?了解 html的基本常識和工作原理 ?掌握如何使用“記事本”編輯網(wǎng)頁 ?了解兩類常用的網(wǎng)頁制作工具 ?掌握 html的語法規(guī)范 二、實(shí)例結(jié)果，如圖所示 圖 84 運(yùn)行結(jié)果 過程與步驟 １ .通過依次單擊任務(wù)欄上的 【 開始 】 → 【 程序 】 → 【 附件 】 → 【記事本 】 菜單命令打開記事本 ２ .在記事本的編輯面板中輸入以下代碼，如圖 81所示。 html head title我的第一個頁面 /title /head body 這是我的第一個 web頁面。 b這段話是被加粗的。 /b /body /html 圖 81 網(wǎng)頁編輯窗口 ? 8. 將此文件保存為“ ”，如圖 82所示。 圖 82 “另存為”對話框 *提示 *： HTML文件的擴(kuò)展名必須為 .htm或者.html。 4. 啟動瀏覽器。 在文件菜單中選擇“打開”（或者“打開頁面”），這時將出現(xiàn)一個對話框。選擇“瀏覽”（或者“選擇文件”），定位到你剛才創(chuàng)建的 HTML文件 ——“”，選擇它，單擊“打開”。然后在對話框中，你將看到這個文件的地址，比如說：“ C:\MyDocuments\ ”。單擊“確定”，瀏覽器將顯示此頁面，如圖 83所示。 圖 83 打開對話框 知識擴(kuò)展 ?擴(kuò)展名與文件類型 ?文件類型與編輯（查看）軟件 ?瀏覽器 ?保存網(wǎng)頁 編碼 Cookie 密碼 代理服務(wù)器 * 提示 *：用鼠標(biāo)雙擊 。 ，如圖 84所示。 三、 涵蓋的知識點(diǎn)： 1． HTML的概念 HTML (HyperText Markup Language，超文本標(biāo)記語言 )是表示網(wǎng)頁的一種規(guī)范 (或者說是一種標(biāo)準(zhǔn) )，它通過標(biāo)記符定義了網(wǎng)頁內(nèi)容的顯示。例如，用table標(biāo)記符在網(wǎng)頁上定義一個表格。 2． HTML的語法 “ ”和“ ”括起來的句子，我們稱它為 標(biāo)簽 ，是用來分割和標(biāo)記文本的元素，以形成文本的布局、文字的格式及五彩繽紛的畫面。 在 HTML中，所有的標(biāo)記符都用尖括號括起來。例如， HTML表示 HTML標(biāo)記符。某些標(biāo)記符，例如換行標(biāo)記符 BR，只要求單一標(biāo)記符號。但絕大多數(shù)標(biāo)記符都是 成對出現(xiàn) 的，包括開始標(biāo)記符和結(jié)束標(biāo)記符。開始標(biāo)記符和相應(yīng)的結(jié)束標(biāo)記符定義了標(biāo)記符所影響的范圍。 ?單標(biāo)簽 某些標(biāo)記稱為“單標(biāo)簽”，因?yàn)樗恍鑶为?dú)使用就能完整地表達(dá)意思，這類標(biāo)記的語法是： 標(biāo)簽名稱 最常用的單標(biāo)簽是 BR, 它表示換行。 ?雙標(biāo)簽 另一類標(biāo)記稱為“雙標(biāo)簽”，它由“始標(biāo)簽”和“尾標(biāo)簽”兩部分構(gòu)成，必須成對使用，其中始標(biāo)簽告訴 Web瀏覽器從此處開始執(zhí)行該標(biāo)記所表示的功能，而尾標(biāo)簽告訴 Web瀏覽器在這里結(jié)束該功能。始標(biāo)簽前加一個斜杠（ /）即成為尾標(biāo)記。這類標(biāo)記的語法是： 標(biāo)簽 內(nèi) 容 / 標(biāo)簽 其中“內(nèi)容” 部分就是要被這對標(biāo)記施加作用的部分。例如你想突出對某段文字的顯示，就將此段文字放在一 EM /EM標(biāo)記中： EM第一：/EM ?標(biāo)簽屬性 許多單標(biāo)記和雙標(biāo)記的始標(biāo)記內(nèi)可以包含一些屬性， 其語法是： 標(biāo)簽名字 屬性 1 屬性 2 屬性 3 … ?各屬性之間無先后次序，屬性也可省略（即取默認(rèn)值），例如標(biāo)題標(biāo)記 H1表示文本以標(biāo)題 1的格式顯示。帶一些屬性： h1 align=center color=red大家生活愉快 ！ /h1 其中 align屬性值表示文本居中顯示， color的屬性值表示文本以紅色顯示。 ?*提示 *： HTML標(biāo)記符是不區(qū)分大小寫的，但通常約定使用大寫標(biāo)記符，這有利于 HTML文檔的維護(hù)。 如果在瀏覽器中任意打開一個網(wǎng)頁，然后在窗口中空白位臵單擊鼠標(biāo)右鍵，選擇“查看源文件”命令 (或者選擇“查看”菜單中的“源文件”命令 )，則系統(tǒng)會啟動“記事本”，其中包含一些文本信息，這些文本其實(shí)就是網(wǎng)頁的本質(zhì) ——HTML 源代碼，也就是我們在記事本中編輯的代碼，如圖 81。 在 HTML文檔中通過使用標(biāo)記符可以告訴瀏覽器如何顯示網(wǎng)頁，即確定內(nèi)容的 顯示格式 。瀏覽器按順序讀取 HTML文件，然后根據(jù)內(nèi)容周圍的 HTML標(biāo)記符解釋和顯示各種內(nèi)容。例如，如果為某段內(nèi)容添加b/b標(biāo)記符 ,則瀏覽器會以粗體字顯示該段內(nèi)容，如圖 84所示。 HTML中的超文本功能，也就是 超鏈接功能 ，使網(wǎng)頁之間可以鏈接起來。網(wǎng)頁與網(wǎng)頁的鏈接構(gòu)成了網(wǎng)站，而網(wǎng)站與網(wǎng)站的鏈接就構(gòu)成了多姿多彩的 WWW。 標(biāo)準(zhǔn) (幾乎所有瀏覽器都支持 ),但 漸普及。最新的標(biāo)準(zhǔn)是 ，它對 了一些小的修正。對于基本的標(biāo)記符， 一致在本書中不作區(qū)分，但本書中的主要內(nèi)容是以 為基礎(chǔ)的。 4．常用網(wǎng)頁編輯工具 Macromedia Dreamweaver——用于制作具有動態(tài)HTML動畫的網(wǎng)頁，用于對 Web站點(diǎn)、 Web頁和 Web應(yīng)用程序進(jìn)行設(shè)計(jì)、編碼和開發(fā)。由于 Dreamweaver提供了非常友好的用戶界面和強(qiáng)大的功能，現(xiàn)已成為專業(yè)用戶和普通用戶首選的網(wǎng)頁開發(fā)工具。 Microsoft FrontPage——用于制作功能強(qiáng)大的網(wǎng)頁。微軟公司的 FrontPage是一款優(yōu)秀的網(wǎng)頁制作和管理軟件。作為 Office家族的新成員， FrontPage繼承了 Office系列軟件界面通用、操作簡單的特點(diǎn)，十分適合初學(xué)者使用。 但是假如你想成為一名熟練的網(wǎng)絡(luò)開發(fā)者，推薦你用純文本編輯器編寫代碼，這有助于學(xué)習(xí) HTML基礎(chǔ)。 實(shí)例 82 HTML文檔結(jié)構(gòu) 一、 學(xué)習(xí)目標(biāo) ?了解 html的文檔結(jié)構(gòu) ?掌握如何使用 meta標(biāo)記 ?掌握如何使用 bgsound標(biāo)記 二、實(shí)例結(jié)果，如圖所示 圖 85 背景音樂 圖 86 跳轉(zhuǎn)后的頁面 標(biāo)題 過程與步驟： 1．通過依次單擊任務(wù)欄上的 【 開始 】 → 【 程序 】 → 【附件 】 → 【 記事本 】 菜單命令打開記事本 2．在記事本的編輯面板中輸入以下代碼： html head title我的第二個頁面 /title meta equiv=refresh content=30。URL= bgsound src=“2022年的第一場雪 .mp3 loop=2 ?/head ?body ?p我們聽音樂。 /p ?/body ?/html ?“ ”。 ?4．運(yùn)行結(jié)果，如圖 85和 86所示。 ? 運(yùn)行 ，首先出現(xiàn)圖 85，同時響起背景音樂， 30秒后，自動轉(zhuǎn)到圖 86。 三、涵蓋的知識點(diǎn)： ?HTML的文檔結(jié)構(gòu) 任何 HTML文檔都包含的基本標(biāo)記符包括：HTML標(biāo)記 HTML和 /HTML、首部標(biāo)記 HEAD和 /HEAD以及正文標(biāo)記 BODY和 /BODY。 ?HTML標(biāo)記 HTML和 /HTML是 Web頁的第一個和最后一個標(biāo)記符， Web頁的其他所有內(nèi)容都位于這兩個標(biāo)記符之間。雖然 HTML標(biāo)記符的開始標(biāo)記符和結(jié)束標(biāo)記符都可以省略 (因?yàn)?.htm或． html擴(kuò)展名已經(jīng)告訴瀏覽器該文檔為 HTML文檔 )，但為了保持完整的網(wǎng)頁結(jié)構(gòu)，建議包含該標(biāo)記。另外， HTML標(biāo)記符通常不包含任何屬性。 首部標(biāo)記 HEAD和 /HEAD位于 Web頁的開頭，其中不包括 Web頁的任何實(shí)際內(nèi)容，而是提供一些與 Web頁有關(guān)的特定信息。例如，可以在首部標(biāo)記中設(shè)臵網(wǎng)頁的標(biāo)題、定義樣式表、插入腳本等。 首部標(biāo)記中的內(nèi)容也用相應(yīng)的標(biāo)記符括起來。例如，樣式表 (CSS)定義位于STYLE和 /STYLE之間；腳本定義位于之間。 4. TITLE標(biāo)記符 在首部標(biāo)記中 ,最基本、最常用的標(biāo)記符是標(biāo)題標(biāo)記符 TITLE和 /TITLE,用于定義網(wǎng)頁的標(biāo)題。網(wǎng)頁標(biāo)題可被瀏覽器用作書簽和收藏清單。當(dāng)網(wǎng)頁在瀏覽器中顯示時，網(wǎng)頁標(biāo)題將在瀏覽器窗口的標(biāo)題欄中顯示。如實(shí)例 2中： title我的第二個頁面 /title 效果如圖 85所示。 5. META標(biāo)記符 在首部標(biāo)記符中另外一個比較常用的標(biāo)記符是 META，又名元標(biāo)記，向?yàn)g覽者提供某一頁面的附加信息，另外用于幫助一些搜索引擎進(jìn)行頁面分析，使導(dǎo)出的頁面正確放入合適的目錄中，元標(biāo)記的種類包括兩類： HTTPEQUIV HTTPEQUIV的一個主要功能：可驅(qū)使瀏覽器在同一窗口中打開另一個頁面，格式如下： META HTTPEQUIV=Refresh CONTENT=。URL= 其中 : 代表所設(shè)定的時間，即在 URL后的指定頁面被打開之前，當(dāng)前頁面在瀏覽器中的顯示時間。如實(shí)例 2中： meta equiv=refresh content=30。URL=表示 30秒后頁面轉(zhuǎn)到 ，效果如圖 85和圖 86所示。 *提示 *：要實(shí)現(xiàn)以上效果，必須使“ URL”后指定的HTML文檔存在。在該例子中，我們指定跳轉(zhuǎn)的目標(biāo)為當(dāng)前目錄的某個文件。在實(shí)際使用此功能時，也可以直接指定一個完整的 URL地址。 ?NAME NAME的格式如下： META NAME=A Contents=B 其中 A是關(guān)于此元標(biāo)記的描述，而 B是從屬于 A部分的附加信息。通常，兩個主要的元標(biāo)記是頁面描述和關(guān)鍵詞。如： META Name=Description Contents=教育科研 META Name=Keywords Contents=教育科學(xué) ,科研 …… 提示： 關(guān)鍵詞以逗號隔開，不要超過 255字符，重要的放在前面。 Keywords中的關(guān)鍵詞一般不要重復(fù)多于 5次。 關(guān)鍵詞可適當(dāng)使用一些 2至 3字的詞組，如 webpage creation比 webpage, creation好。 6． BGSOUND標(biāo)記符 InterExplorer還支持另外一個用于頭部的標(biāo)記符 —— BGSOUND，它可用予指定網(wǎng)頁的背景音樂。 BGSOUND標(biāo)記符 只有開始標(biāo)記符 ，沒有標(biāo)記符。它的基本屬性是 src，用于指定背景音樂的源文件。另外一個常用屬性是 loop，用于指定背景音樂重復(fù)的次數(shù)，如果不指定該屬性，