HTML和中文DreamweaverMX2004實用教程

1、 本章要點本章要點l1.1 Internet簡介簡介 l1.2 “卡通青蛙卡通青蛙”網頁網頁 l1.3 “我的收藏我的收藏”網頁網頁l1.4 再做再做“我的收藏我的收藏”網頁網頁 l1.5 “俏皮歇后語俏皮歇后語”網頁網頁 l1.6 “動畫放映室動畫放映室”網頁網頁 l1.7 “HTML技術演示技術演示”網頁網頁 l1.8 “中國的世界文化遺產中國的世界文化遺產”網頁網頁 l1.9 “Flash技術說明技術說明”網頁網頁 l1.10 “公告板公告板”網頁網頁 l1.11 “水中人水中人”網頁網頁 l1.12 “俄羅斯方塊游戲俄羅斯方塊游戲”網頁網頁 l習題習題 1 1.1.1 什么是什么是In

2、ternet1計算機網絡計算機網絡是將地理位置不同并具有獨立工作能力的多個計算機系統(tǒng)通過計算機網絡是將地理位置不同并具有獨立工作能力的多個計算機系統(tǒng)通過通信線路互連在一起，由網絡軟件實現網絡資源共享和相互通信的整個信通信線路互連在一起，由網絡軟件實現網絡資源共享和相互通信的整個信息系統(tǒng)。息系統(tǒng)。物理上，計算機網絡主要是由計算機、路由器、集線器、調制解調器、網物理上，計算機網絡主要是由計算機、路由器、集線器、調制解調器、網卡、中繼器、收發(fā)器以及交換機等網絡硬件設備組成，所有這些設備統(tǒng)稱卡、中繼器、收發(fā)器以及交換機等網絡硬件設備組成，所有這些設備統(tǒng)稱為網絡單元。計算機網絡按照覆蓋的地域大小，可分為

3、局域網（即為網絡單元。計算機網絡按照覆蓋的地域大小，可分為局域網（即LAN，范圍不超過范圍不超過10km）和廣域網（即）和廣域網（即WAN，一般指，一般指10km以上范圍）。任何計以上范圍）。任何計算機網絡，無論是局域網、城域網、廣域網還是因特網都可以劃分為兩個算機網絡，無論是局域網、城域網、廣域網還是因特網都可以劃分為兩個部分：一部分是負責信息收集和處理的資源子網，另一部分是負責信息傳部分：一部分是負責信息收集和處理的資源子網，另一部分是負責信息傳輸的通信子網。輸的通信子網。 2InternetInternet一詞來源于英文一詞來源于英文Interconnect networks，即，即“互

4、連各個網絡互連各個網絡”，簡稱，簡稱“互聯(lián)互聯(lián)網網”，中文譯名為，中文譯名為“因特網因特網”。Internet是專指全球范圍內最大的、由眾多網絡相互是專指全球范圍內最大的、由眾多網絡相互連接而成的、基于連接而成的、基于TCP/IP的計算機網絡。的計算機網絡。Internet是當今世界最大的計算機互連網是當今世界最大的計算機互連網絡系統(tǒng)，由全球絡系統(tǒng)，由全球100多個國家和地區(qū)無數的不同功能的計算機、通信骨干網和各種多個國家和地區(qū)無數的不同功能的計算機、通信骨干網和各種計算機網絡通過線路連接在一起的一個世界范圍的網絡。計算機網絡通過線路連接在一起的一個世界范圍的網絡。在在Internet中，資源

5、是存放在服務器上的，中，資源是存放在服務器上的，Internet上的服務器晝夜不停地工作，分上的服務器晝夜不停地工作，分別存儲著各種各樣的信息，提供多種服務功能，用戶通過客戶機（個人計算機）訪別存儲著各種各樣的信息，提供多種服務功能，用戶通過客戶機（個人計算機）訪問服務器，從而獲取資源。問服務器，從而獲取資源。Internet服務器的資源主要有：超級計算中心、圖書文獻服務器的資源主要有：超級計算中心、圖書文獻中心、技術資料中心、公共軟件庫、科學數據庫、地址目錄庫以及信息庫等。中心、技術資料中心、公共軟件庫、科學數據庫、地址目錄庫以及信息庫等。Internet服務器的主要信息服務有：萬維網服務（

6、服務器的主要信息服務有：萬維網服務（WWW）、電子郵件服務（）、電子郵件服務（E-mail）、遠程登錄服務（）、遠程登錄服務（Telnet）、文件傳輸服務（）、文件傳輸服務（FTP）、網絡新聞服務）、網絡新聞服務（USENET）、電子公告板服務（）、電子公告板服務（BBS），還有網上購物、網上會議、網上聊天、），還有網上購物、網上會議、網上聊天、網上炒股、網上交友、網上書店、網上報刊、網上廣播、網上畫廊、網上電影和網網上炒股、網上交友、網上書店、網上報刊、網上廣播、網上畫廊、網上電影和網上音樂等。各服務器之間通過網絡協(xié)議相互連接，配合工作，資源共享。當用戶與上音樂等。各服務器之間通過網絡協(xié)議相

7、互連接，配合工作，資源共享。當用戶與其中一臺服務器建立連接后，便可以以鏈接的方式訪問整個網絡，服務程序可以根其中一臺服務器建立連接后，便可以以鏈接的方式訪問整個網絡，服務程序可以根據用戶的需要，自動地從一臺服務器轉移到另一臺服務器。一旦進入了據用戶的需要，自動地從一臺服務器轉移到另一臺服務器。一旦進入了Internet，無，無論所需要的信息是在哪一個國家或地區(qū)的服務器上，只要是合法的登錄者，就可以論所需要的信息是在哪一個國家或地區(qū)的服務器上，只要是合法的登錄者，就可以漫游漫游Internet，享用所需要的信息和資源。，享用所需要的信息和資源。Internet是當今世界上最大的資源子網。是當今世

8、界上最大的資源子網。Internet正在向著全球信息高速公路的方向快速、健康地發(fā)展。正在向著全球信息高速公路的方向快速、健康地發(fā)展。 3Internet的發(fā)展1969年，美國國防部高級研究計劃署（年，美國國防部高級研究計劃署（Advanced Research Project Agency，ARPA）撥款支持建立了軍用實驗網絡）撥款支持建立了軍用實驗網絡ARPANET。它是世界上第一個計算。它是世界上第一個計算機網絡，也是機網絡，也是Internet的前身，初期只有的前身，初期只有4臺主機。當時，美國國防部研究臺主機。當時，美國國防部研究并建立并建立ARPANET的主要目的是尋求一種將不同種類

9、的計算機互連成網絡的的主要目的是尋求一種將不同種類的計算機互連成網絡的方法，同時能使該網絡的一部分遭破壞時不影響網絡其他部分的正常運行。方法，同時能使該網絡的一部分遭破壞時不影響網絡其他部分的正常運行。以后，以后，ARPANET的應用由軍事領域延伸到教育領域，科學家們開始使用的應用由軍事領域延伸到教育領域，科學家們開始使用ARPANET交換信息，共享研究成果。交換信息，共享研究成果。1983年，年，TCP/IP（即傳輸控制協(xié)議（即傳輸控制協(xié)議和網際間協(xié)議）的建立，使計算機通信有了統(tǒng)一的標準，這是計算機網絡和網際間協(xié)議）的建立，使計算機通信有了統(tǒng)一的標準，這是計算機網絡發(fā)展史上的一個里程碑，網絡

10、從此進入高速發(fā)展的時代。發(fā)展史上的一個里程碑，網絡從此進入高速發(fā)展的時代。1986年，美國國家科學基金會（年，美國國家科學基金會（National Science Foundation，NSF）開始）開始將美國各地的研究人員及分屬各大學和研究機構的計算中心連接到了分布將美國各地的研究人員及分屬各大學和研究機構的計算中心連接到了分布在不同地區(qū)的在不同地區(qū)的5個超級計算中心。至此，越來越多的高等院校、科研機構、個超級計算中心。至此，越來越多的高等院校、科研機構、圖書館、實驗室、政府部門、商業(yè)集團、醫(yī)院和個人所使用的圖書館、實驗室、政府部門、商業(yè)集團、醫(yī)院和個人所使用的NSFNET逐逐漸取代了早期源

11、于軍事目的的漸取代了早期源于軍事目的的ARPANET。終于，在。終于，在1990年年7月，月，ARPANET完全被完全被NSFNET取代。到目前為止，連接在網絡上的主機已經達取代。到目前為止，連接在網絡上的主機已經達到了數百萬臺。一般認為，正是到了數百萬臺。一般認為，正是NSFNET才使才使Internet迅速推廣到全球范圍。迅速推廣到全球范圍。 1994年年5月，中國作為第月，中國作為第71個國家級網加入個國家級網加入Internet，“中國國家計算機網絡設施中國國家計算機網絡設施”（The National Computing and Network Facility of China，N

12、CFC，國內也稱中關，國內也稱中關村網）與村網）與Internet連通。連通。我國從我國從1994年中國科技網與年中國科技網與Internet連通后，共有連通后，共有4大互聯(lián)網通過大互聯(lián)網通過6大國際出口與大國際出口與Internet相連。這相連。這4大互聯(lián)網分別是：中國科技網（大互聯(lián)網分別是：中國科技網（CSTNET）、中國教育和科研計）、中國教育和科研計算機網（算機網（CERNET）、中國公用計算機互聯(lián)網（）、中國公用計算機互聯(lián)網（ChinaNET）和國家公用經濟信息）和國家公用經濟信息網（即金橋網（網（即金橋網（ChinaGBN），其中，前兩個網絡是非盈利性的，以為教育、科），其中，前兩

13、個網絡是非盈利性的，以為教育、科研和政府部門服務為宗旨，原則上不對外接納個人和商業(yè)用戶，后兩個網絡是面向研和政府部門服務為宗旨，原則上不對外接納個人和商業(yè)用戶，后兩個網絡是面向全國提供商業(yè)服務的網絡。全國提供商業(yè)服務的網絡。目前，我國目前，我國Internet商業(yè)市場十分活躍，除去上述商業(yè)市場十分活躍，除去上述4家外，一些商業(yè)公司也開始紛紛家外，一些商業(yè)公司也開始紛紛投入這一市場，形成若干商業(yè)投入這一市場，形成若干商業(yè)ISP（Internet Service Provider，Internet服務提供服務提供商）。他們的基本作法大多是：自己建立一個網絡服務中心，通過專線從上述幾個商）。他們的基

14、本作法大多是：自己建立一個網絡服務中心，通過專線從上述幾個網絡的國際出口與網絡的國際出口與Internet相連，提供服務的業(yè)務主要有用戶接入服務（撥號上網和相連，提供服務的業(yè)務主要有用戶接入服務（撥號上網和專線上網）、培訓服務、服務器托管、代理域名注冊、出租硬盤空間、收發(fā)電子郵專線上網）、培訓服務、服務器托管、代理域名注冊、出租硬盤空間、收發(fā)電子郵件、網上教學、金融證券以及電子商務等。件、網上教學、金融證券以及電子商務等。隨著計算機和通信技術的發(fā)展，計算機網絡由過去的軍事與教育專用網絡發(fā)展成為隨著計算機和通信技術的發(fā)展，計算機網絡由過去的軍事與教育專用網絡發(fā)展成為無所不包、無所不能的國際互聯(lián)網

15、絡（無所不包、無所不能的國際互聯(lián)網絡（Internet）。）。Internet已經成為我們生活與工已經成為我們生活與工作中不可缺少的一部分，它正以人們難以想象的速度迅猛發(fā)展。作中不可缺少的一部分，它正以人們難以想象的速度迅猛發(fā)展。 1.1.2 TCP/IPInternet沒有形成之前，各個地方已經建立了很多小型的局域網，沒有形成之前，各個地方已經建立了很多小型的局域網，Internet是將全球是將全球各地的局域網連接起來而形成的一個各地的局域網連接起來而形成的一個“網之間的網網之間的網”（即網際網）。然而，在連接（即網際網）。然而，在連接之前的各式各樣的局域網卻存在不同的網絡結構和數據傳輸規(guī)則

16、，將這些小網連接之前的各式各樣的局域網卻存在不同的網絡結構和數據傳輸規(guī)則，將這些小網連接起來后，各網之間要通過什么樣的規(guī)則來傳輸數據呢？這就像世界上有很多個國家，起來后，各網之間要通過什么樣的規(guī)則來傳輸數據呢？這就像世界上有很多個國家，各個國家的人說各自的語言，只有將各種語言翻譯成一種通用的語言后才可以交流。各個國家的人說各自的語言，只有將各種語言翻譯成一種通用的語言后才可以交流。TCP/IP正是正是Internet上的一種公用語言的規(guī)范約定。上的一種公用語言的規(guī)范約定。TCP/IP是是Transmission Control Protocol/Internet Protocol的縮寫，中文譯

17、名為傳輸的縮寫，中文譯名為傳輸控制協(xié)議控制協(xié)議/互聯(lián)網絡協(xié)議，是互聯(lián)網絡協(xié)議，是Internet最基本的協(xié)議，是由底層的最基本的協(xié)議，是由底層的IP和和TCP組成的。組成的。TCP/IP的開發(fā)工作始于上世紀的開發(fā)工作始于上世紀70年代，是用于互聯(lián)網的第一套協(xié)議。年代，是用于互聯(lián)網的第一套協(xié)議。1IPIP是因特網中的基礎協(xié)議，它非常詳細地定義了計算機通信應該遵循的規(guī)則，準確是因特網中的基礎協(xié)議，它非常詳細地定義了計算機通信應該遵循的規(guī)則，準確地定義了分組的組成和路由器如何將一個分組傳遞到目的地。連到地定義了分組的組成和路由器如何將一個分組傳遞到目的地。連到Internet上的計算上的計算機需要機

18、需要IP軟件才能在互聯(lián)網上通信。由軟件才能在互聯(lián)網上通信。由IP控制傳輸的協(xié)議單元被稱為控制傳輸的協(xié)議單元被稱為IP數據報。數據報。IP數據報中含有發(fā)數據報中含有發(fā)/收方的收方的IP地址。地址。IP提供不可靠的、盡力的及無連接的數據報投遞服提供不可靠的、盡力的及無連接的數據報投遞服務，構成了因特網數據傳輸的基礎。務，構成了因特網數據傳輸的基礎。IP是最基本的軟件，是最基本的軟件，Internet上的所有通信只有上的所有通信只有使用使用IP才能進行分組交換。所以，才能進行分組交換。所以，Internet上的每臺計算機都要安裝一套供所有應用上的每臺計算機都要安裝一套供所有應用共享的共享的IP軟件的

19、拷貝。在高級的計算機上，內存中隨時保留軟件的拷貝。在高級的計算機上，內存中隨時保留IP的一個拷貝，時刻準的一個拷貝，時刻準備發(fā)送或接收分組。備發(fā)送或接收分組。 1.1.3 萬維網、網頁和網站萬維網、網頁和網站1什么是萬維網萬維網也叫萬維網也叫WWW，是，是World Wide Web（全球信息網）的縮寫。萬維網是歐洲粒子（全球信息網）的縮寫。萬維網是歐洲粒子物理研究所（物理研究所（CERN）的科學家）的科學家Tim Berners-Lee發(fā)明的。他提出了超文本發(fā)明的。他提出了超文本（Hypertext）的結構體系，該體系是由相互關聯(lián)的文件組成的一種高級的基于超文）的結構體系，該體系是由相互關聯(lián)

20、的文件組成的一種高級的基于超文本的瀏覽和搜索方式，目的是讓大家在不同地方用一種簡捷的方式共享信息資源。本的瀏覽和搜索方式，目的是讓大家在不同地方用一種簡捷的方式共享信息資源。萬維網提供了非常豐富的信息，各種信息按不同的類型以網頁文件的形式分別存放萬維網提供了非常豐富的信息，各種信息按不同的類型以網頁文件的形式分別存放在萬維網服務器上，供人們選擇查閱。萬維網使得瀏覽在萬維網服務器上，供人們選擇查閱。萬維網使得瀏覽Internet的信息變得非常簡單，的信息變得非常簡單，它已成為它已成為Internet用戶使用最廣泛的網絡服務系統(tǒng)。用戶使用最廣泛的網絡服務系統(tǒng)。萬維網制定了一套標準、又容易掌握的超文

21、本萬維網制定了一套標準、又容易掌握的超文本HTML語言、統(tǒng)一的資源定位符語言、統(tǒng)一的資源定位符URL和超文本傳輸協(xié)議（和超文本傳輸協(xié)議（hypertext transport protocol，HTTP）。）。超文本傳輸協(xié)議是在瀏覽器與超文本傳輸協(xié)議是在瀏覽器與Web服務器間建立連接的協(xié)議標準。超文本由若干互服務器間建立連接的協(xié)議標準。超文本由若干互連的超媒體文件組成，它實質是通過超鏈接把一些具有超媒體特性的信息鏈接起來連的超媒體文件組成，它實質是通過超鏈接把一些具有超媒體特性的信息鏈接起來的一種新型的信息管理技術。超媒體不但包括了文本內容，還包括圖像、動畫、聲的一種新型的信息管理技術。超媒體

22、不但包括了文本內容，還包括圖像、動畫、聲音和視頻等。超鏈接就是通過超文本中的鏈接點（也叫音和視頻等。超鏈接就是通過超文本中的鏈接點（也叫“參考點參考點”或或“熱點熱點”）建）建立與其他超媒體文件的鏈接，用鼠標單擊參考點即可調出與之相鏈接的其他超媒體立與其他超媒體文件的鏈接，用鼠標單擊參考點即可調出與之相鏈接的其他超媒體文件（如網頁）。文件（如網頁）。瀏覽瀏覽WWW必須通過瀏覽器來完成。瀏覽器是用來訪問必須通過瀏覽器來完成。瀏覽器是用來訪問Internet的基于超文本技術使的基于超文本技術使用最廣泛的網絡軟件，它可以提供包括用最廣泛的網絡軟件，它可以提供包括WWW的瀏覽、搜索、網絡資訊的打印和收

23、的瀏覽、搜索、網絡資訊的打印和收發(fā)發(fā)E-mail的功能。在瀏覽器中，比較有代表性的是的功能。在瀏覽器中，比較有代表性的是IE（Internet Explorer）、）、Netscape和和Opera等。等。 2網頁和網站組成組成WWW的基本元素是網頁，網頁也被稱為頁面或的基本元素是網頁，網頁也被稱為頁面或Web頁。不同的網頁頁。不同的網頁通過超鏈接聯(lián)系在一起，構成了通過超鏈接聯(lián)系在一起，構成了WWW的縱橫交織結構。的縱橫交織結構。WWW是由無數是由無數的的Web服務器構成的，可以通過瀏覽器訪問這些服務器上的網頁。服務器構成的，可以通過瀏覽器訪問這些服務器上的網頁。通常把一系列邏輯上可以視為一個

24、整體的頁面叫作網站，或者說，網站就通常把一系列邏輯上可以視為一個整體的頁面叫作網站，或者說，網站就是一個相互鏈接的網頁集合，它們可以共享。網站的概念是相對的，大網是一個相互鏈接的網頁集合，它們可以共享。網站的概念是相對的，大網站（如站（如“雅虎網雅虎網”和和“新浪網新浪網”）頁面多得無法計數，而且位于多臺服務）頁面多得無法計數，而且位于多臺服務器上；小網站可以是一些個人網站，可能只有幾個網頁，僅在一臺服務器器上；小網站可以是一些個人網站，可能只有幾個網頁，僅在一臺服務器上占據很小的空間。上占據很小的空間。網頁與網頁之間的關系并不是完全相同的。主頁是網站中的一個特殊網頁，網頁與網頁之間的關系并不

25、是完全相同的。主頁是網站中的一個特殊網頁，它是在它是在WWW上進入網站的第一個網頁，其中包含指向其他網頁的超鏈接。上進入網站的第一個網頁，其中包含指向其他網頁的超鏈接。通常主頁的名稱是固定的，例如，通常主頁的名稱是固定的，例如，index.htm或或 index.html等（等（.htm或或.html擴展名表示是擴展名表示是HTML文檔）。文檔）。 1.1.4 Internet地址地址Internet采用一種惟一通用的地址格式，為采用一種惟一通用的地址格式，為Internet中的每一個網絡和幾乎中的每一個網絡和幾乎每一臺主機都分配了一個地址，就像一個實實在在的整體。每一臺主機都分配了一個地址，

26、就像一個實實在在的整體。Internet中地址中地址類型有類型有IP地址和域名地址兩種。地址和域名地址兩種。1IP地址連接在連接在Internet上的每臺計算機都有一個惟一的地址，發(fā)送方計算機在通信上的每臺計算機都有一個惟一的地址，發(fā)送方計算機在通信之前必須知道接收方計算機的地址，這和我們日常郵寄普通信件是一樣的之前必須知道接收方計算機的地址，這和我們日常郵寄普通信件是一樣的道理，只是道理，只是Internet上使用的地址稱為上使用的地址稱為Internet地址，簡稱地址，簡稱IP地址。地址。IP地址地址是是4個以小數點隔開的十進制整數，每個整數的范圍是個以小數點隔開的十進制整數，每個整數的范

27、圍是0255。Internet上上的每一臺計算機和路由器都有一個由相關的管理機構指定的的每一臺計算機和路由器都有一個由相關的管理機構指定的IP地址。計算地址。計算機用機用4個字節(jié)的二進制單位（個字節(jié)的二進制單位（32位）存儲位）存儲IP地址，每個整數對應一個字節(jié)。地址，每個整數對應一個字節(jié)。例如，有一臺計算機的例如，有一臺計算機的IP地址為：地址為：，而另一臺計算機的，而另一臺計算機的IP地址地址為為:0。IP地址分為地址分為5類。類。A類（類（A Class）：）：55適用于大型網絡。適用于大型網絡。B類（類（B

28、Class）：）：55適用于中型網絡。適用于中型網絡。C類（類（C Class）：）：55適用于小型網絡。適用于小型網絡。D類和類和E類：保留作特殊用途。類：保留作特殊用途。 2計算機域名由于由于IP地址是數字型的，不方便記憶，也難以理解，所以地址是數字型的，不方便記憶，也難以理解，所以Internet采用了另一套字符采用了另一套字符（可以有英文字母、數字和漢字等）的地址方案，即域名地址。域名地址用具有一（可以有英文字母、數字和漢字等）的地址方案，即域名地址。域名地址用具有一定意義的字符串來標識主機地址，定

29、意義的字符串來標識主機地址，IP與域名地址兩者相互對應，而且保持全網統(tǒng)一。與域名地址兩者相互對應，而且保持全網統(tǒng)一。在網絡中，一臺主機的在網絡中，一臺主機的IP地址是惟一的，而每臺主機只能有一個地址是惟一的，而每臺主機只能有一個IP地址，但它的域地址，但它的域名數卻可以有多個。名數卻可以有多個。域名系統(tǒng)（域名系統(tǒng)（Domain Name System，DNS）負責將）負責將Internet上每臺主機的英文名字轉上每臺主機的英文名字轉換成換成IP地址的系統(tǒng)。用戶可以只輸入要查找的主機的域名，地址的系統(tǒng)。用戶可以只輸入要查找的主機的域名，DNS系統(tǒng)把它轉換成系統(tǒng)把它轉換成IP地址后，計算機才能夠根

30、據地址后，計算機才能夠根據IP地址進行查找。當然并不是每臺在地址進行查找。當然并不是每臺在Internet上的主機都上的主機都有域名，例如，撥號上網的用戶每次連接有域名，例如，撥號上網的用戶每次連接Internet時，只需要一個時，只需要一個“動態(tài)動態(tài)”的的IP地址，地址，不需要域名。也就是說，不需要域名。也就是說，Internet上的每臺主機都有一個上的每臺主機都有一個IP地址，但不一定有域名。地址，但不一定有域名。一臺計算機的域名由若干代表不同層次的子域名組成，各個子域名之間用小數點分一臺計算機的域名由若干代表不同層次的子域名組成，各個子域名之間用小數點分開。其中最左邊的子域名通常代表主機

31、，中間各子域名代表相應的層次，最右邊的開。其中最左邊的子域名通常代表主機，中間各子域名代表相應的層次，最右邊的子域名是標準化的最高級子域名，主要表示主機所屬的國家、地區(qū)或網絡性質的代子域名是標準化的最高級子域名，主要表示主機所屬的國家、地區(qū)或網絡性質的代碼。例如，中國是碼。例如，中國是cn，英國是，英國是uk、商業(yè)組織是、商業(yè)組織是com、教育機構是、教育機構是edu、政府部門是、政府部門是gov、軍事部門是、軍事部門是mil、網絡信息和運營中心是、網絡信息和運營中心是net、非商業(yè)組織是、非商業(yè)組織是org以及國際組織以及國際組織是是int等。二級域名（右起第二個子域名）有：教育（等。二級域

32、名（右起第二個子域名）有：教育（edu）、電信網（）、電信網（net）、科研）、科研網（網（ca）、團體（）、團體（or）、政府（）、政府（go）、商業(yè)（）、商業(yè)（co）以及軍隊（）以及軍隊（mi）等。各省則采用）等。各省則采用其拼音宿寫，如其拼音宿寫，如bj代表北京、代表北京、sh代表上海、代表上海、ah則代表安徽。則代表安徽。 例如，域名例如，域名對應一個對應一個IP地址，其中地址，其中youdian是該機構的名字，是該機構的名字，edu表示教育機構，表示教育機構，cn表示中國。表示中國。例如，域名例如，域名對應一個對應一個IP地址，其中地址，其中xyz是主機名，是主機名，netbook是

33、該機構名，是該機構名，com表示商業(yè)組織，表示商業(yè)組織，cn表示中國。表示中國。另外，還要注意域名只能以字母或數字開頭，以字母或數字結尾，中間可另外，還要注意域名只能以字母或數字開頭，以字母或數字結尾，中間可以用字母、字符、數字、連字符或下劃線。域名不區(qū)分大小寫，整個長度以用字母、字符、數字、連字符或下劃線。域名不區(qū)分大小寫，整個長度不得超過不得超過255個字符。個字符。由于由于Internet源自美國，所以美國主機其第一級域名一般直接說明其主機性源自美國，所以美國主機其第一級域名一般直接說明其主機性質，而不是國家代碼。如果用戶看到某主機的第一級域名為質，而不是國家代碼。如果用戶看到某主機的第

34、一級域名為com、edu或或gov等，一般可以判斷這臺主機置于美國，因為其他國家或地區(qū)第一級域名一等，一般可以判斷這臺主機置于美國，因為其他國家或地區(qū)第一級域名一般是其國家或地區(qū)的代碼。般是其國家或地區(qū)的代碼。 “卡通青蛙”網頁在瀏覽器中的顯示效果如圖1-2-1所示。網頁中的青蛙除了大小不同以外，在圖片的周圍還增加了粗細不同的邊框。 圖1-2-1 “卡通青蛙”網頁 1.2.1 HTML語言和輸入語言和輸入HTML語言語言1HTML語言簡介HTML的英文全稱為的英文全稱為Hypertext makeup language ，直譯為超文本標記語言。，直譯為超文本標記語言。HTML語言不是一種程序語

35、言，而是一種描述文檔結構的標記語言，它與操作系統(tǒng)平臺的語言不是一種程序語言，而是一種描述文檔結構的標記語言，它與操作系統(tǒng)平臺的選擇無關，只要有瀏覽器就可以運行選擇無關，只要有瀏覽器就可以運行HTML文檔，顯示網頁內容。文檔，顯示網頁內容。HTML語言使用了一些約定的標記，對語言使用了一些約定的標記，對WWW上的各種信息進行標記，瀏覽器會自上的各種信息進行標記，瀏覽器會自動根據這些標記，在屏幕上顯示出相應的內容，而標記符號不會在屏幕上顯示出來。動根據這些標記，在屏幕上顯示出相應的內容，而標記符號不會在屏幕上顯示出來。自從自從1990年首次將年首次將HTML語言用于網頁制作后，幾乎所有的網頁都是由

36、語言用于網頁制作后，幾乎所有的網頁都是由HTML語言語言或以其他語言鑲嵌在或以其他語言鑲嵌在HTML語言中的語言（如語言中的語言（如JavaScript語言等）編寫的。語言等）編寫的。目前，較流行的瀏覽器有目前，較流行的瀏覽器有Netscape公司的公司的Netscape Navigator和和Microsoft公司的公司的Internet Explorer（即（即IE）。要注意，不同的瀏覽器對同一個）。要注意，不同的瀏覽器對同一個HTML文件的解釋可文件的解釋可能會不太一樣。能會不太一樣。使用使用HTML語言編寫語言編寫HTML語言程序（即制作網頁文件）是學習制作網頁的基礎。語言程序（即制作

37、網頁文件）是學習制作網頁的基礎。雖然目前有許多雖然目前有許多“所見即所得所見即所得”且操作較方便的網頁制作工具，不需要直接用且操作較方便的網頁制作工具，不需要直接用HTML語言編寫語言編寫HTML語言程序，但是在很多時候，了解一些語言程序，但是在很多時候，了解一些HTML語言知識，將語言知識，將有利于學習網頁制作工具、學習編輯修改網頁的知識和提高網頁制作水平。有利于學習網頁制作工具、學習編輯修改網頁的知識和提高網頁制作水平。 2輸入輸入HTML語言語言編寫編寫HTML文檔可以在文檔可以在Windows記事本內輸入。在存盤輸入文件名時，一記事本內輸入。在存盤輸入文件名時，一定要輸入定要輸入HTM

38、L文檔的擴展名：文檔的擴展名：.htm或或.html。要注意：。要注意：HTML文檔中的各文檔中的各種英文標記要在英文輸入方式下輸入。為了便于管理，可在磁盤目錄下建種英文標記要在英文輸入方式下輸入。為了便于管理，可在磁盤目錄下建立一個名為立一個名為“我的網站我的網站”的文件夾用來存儲的文件夾用來存儲HTML文檔。再在該文件夾下文檔。再在該文件夾下建立一個名為建立一個名為“image”的文件夾用來存儲網頁中的圖像文件。的文件夾用來存儲網頁中的圖像文件。 1.2.2 調整圖像大小和邊框的調整圖像大小和邊框的HTML標記標記1在網頁中插入圖像的HTML標記在網頁中插入圖像時使用的標記是在網頁中插入圖

39、像時使用的標記是，用來加載，用來加載GIF圖像與動畫，圖像與動畫，“SRC”屬性用來輸入圖像的路徑。在網頁中加載屬性用來輸入圖像的路徑。在網頁中加載GIF動畫的方法與加載動畫的方法與加載GIF圖像的方法一樣。圖像的方法一樣。GIF動畫文件的擴展名也是動畫文件的擴展名也是.gif，文件格式是，文件格式是GIF89A格式。格式。2調整圖像大小的HTML標記使用使用標記中的標記中的HEIGHT和和WIDTH屬性可以調整圖像的大小。屬性可以調整圖像的大小。HEIGHT（決定圖像的高）和（決定圖像的高）和WIDTH（決定圖像的寬）的取值單位為像素。（決定圖像的寬）的取值單位為像素。3給圖像加邊框的HTM

40、L標記使用使用標記中的標記中的BORDER屬性可以給圖像加邊框。屬性可以給圖像加邊框。BORDER的取值單的取值單位為像素，當它的取值為位為像素，當它的取值為0或者不加或者不加BORDER屬性時，則沒有邊框。屬性時，則沒有邊框。 “我的收藏我的收藏”網頁的顯示效果如圖網頁的顯示效果如圖1-3-1所示。在網頁中，列出了最喜愛的所示。在網頁中，列出了最喜愛的3輛汽車的圖像，在圖片的旁邊，還有一句簡短的介紹。通過圖輛汽車的圖像，在圖片的旁邊，還有一句簡短的介紹。通過圖1-3-1可以看可以看出，每一幅圖像旁的文字位置有所不同。出，每一幅圖像旁的文字位置有所不同。 圖1-3-1 “我的收藏”網頁 1.3

41、.1 瀏覽和修改網頁瀏覽和修改網頁1瀏覽網頁雙擊雙擊HTML文檔圖標，調出瀏覽器窗口，同時打開該網頁。另外，還可以文檔圖標，調出瀏覽器窗口，同時打開該網頁。另外，還可以采用如下方法。采用如下方法。圖1-3-2 “打開”對話框（1）雙擊瀏覽器圖標，調出瀏覽器窗口。然后執(zhí)行瀏覽器窗口內的）雙擊瀏覽器圖標，調出瀏覽器窗口。然后執(zhí)行瀏覽器窗口內的“文文件件”“打開打開”菜單命令，調出菜單命令，調出“打開打開”對話框，如圖對話框，如圖1-3-2所示（所示（“打開打開”文本框內還沒有內容）。文本框內還沒有內容）。 圖1-3-2 “打開”對話框 （2）單擊）單擊“打開打開”對話框中的對話框中的“瀏覽瀏覽”按

42、鈕，調出按鈕，調出“Microsoft Internet Explorer”對話框，選擇對話框，選擇HTML文件，單擊文件，單擊“打開打開”按鈕，回到按鈕，回到“打開打開”對對話框，在其話框，在其“打開打開”下拉列表框內已有選中的文件目錄與名字，如圖下拉列表框內已有選中的文件目錄與名字，如圖1-3-2所示。所示。（3）單擊）單擊“打開打開”對話框中的對話框中的“確定確定”按鈕，即可在瀏覽器中打開選擇的按鈕，即可在瀏覽器中打開選擇的網頁。網頁。2修改網頁執(zhí)行執(zhí)行“Microsoft Internet Explorer”瀏覽器窗口中的瀏覽器窗口中的“查看查看”“源文件源文件”菜單命令，調出菜單命令

43、，調出Windows記事本窗口，并在該窗口中顯示出該網頁的代碼，記事本窗口，并在該窗口中顯示出該網頁的代碼，此時即可修改網頁代碼。此時即可修改網頁代碼。 1.3.2 調整圖像和文本的相對位置調整圖像和文本的相對位置在網頁中，經常需要將圖像和文本放在一起進行顯示。使用在網頁中，經常需要將圖像和文本放在一起進行顯示。使用標記的標記的ALIGN屬性可以調整圖像與文本的相對位置。使用屬性可以調整圖像與文本的相對位置。使用標記中的標記中的VSPACE和和HSPACE屬性可以調整圖像與文本間的距離。屬性可以調整圖像與文本間的距離。VSPACE（圖像與（圖像與文本的垂直間距）和文本的垂直間距）和HSPACE

44、（圖像與文本的水平間距）的單位均為像素。（圖像與文本的水平間距）的單位均為像素。標記中的標記中的ALIGN屬性用于調整圖像與文字的對齊方式，主要含義如屬性用于調整圖像與文字的對齊方式，主要含義如下。下。（1）ALIGN項缺省時：圖像的底部與其他文本或圖像的底部對齊。項缺省時：圖像的底部與其他文本或圖像的底部對齊。（2）ALIGN=top：圖像的頂部與其他文本或圖像的頂部對齊。：圖像的頂部與其他文本或圖像的頂部對齊。（3）ALIGN=middle：圖像的中部與其他文本或圖像的中部對齊。：圖像的中部與其他文本或圖像的中部對齊。（4）ALIGN=bottom：圖像的底部與其他文本或圖像的底部對齊。：

45、圖像的底部與其他文本或圖像的底部對齊。（5）ALIGN=left：圖像位于屏幕左邊，與文本或圖像的左邊對齊。：圖像位于屏幕左邊，與文本或圖像的左邊對齊。（6）ALIGN=right：圖像位于屏幕右邊，與文本或圖像的右邊對齊。：圖像位于屏幕右邊，與文本或圖像的右邊對齊。 再做再做“我的收藏我的收藏”網頁后，當鼠標移到圖像上時，會顯示出一段浮動的文網頁后，當鼠標移到圖像上時，會顯示出一段浮動的文字說明。當關閉瀏覽器中的載入圖像命令時，說明文字可以替代圖像。在字說明。當關閉瀏覽器中的載入圖像命令時，說明文字可以替代圖像。在“我的收藏我的收藏”網頁中除了為圖像添加了說明文字外，還為網頁添加了背景網頁中

46、除了為圖像添加了說明文字外，還為網頁添加了背景圖像。網頁的部分顯示效果如圖圖像。網頁的部分顯示效果如圖1-4-1所示。所示。 圖1-4-1 “我的收藏”網頁（部分）的顯示效果 1.4.1 文件的路徑名和文件的路徑名和URL1文件的路徑名（1）絕對路徑：絕對路徑是寫出全部路徑，系統(tǒng)按照全部路徑進行文件的）絕對路徑：絕對路徑是寫出全部路徑，系統(tǒng)按照全部路徑進行文件的查找。絕對路徑中的盤符后用查找。絕對路徑中的盤符后用“：”或或“：/”，各個目錄名之間以及目錄名，各個目錄名之間以及目錄名與文件名之間，應用與文件名之間，應用“”或或“/”分隔開。絕對路徑名的寫法及其含義如表分隔開。絕對路徑名的寫法及其

47、含義如表1-4-1所示。所示。 （2）相對路徑：相對路徑是以當前文件所在路徑或子目錄為起始目錄，進行相對的文件查找。在網頁制作的過程中通常都采用相對路徑，這樣可以保證文件移動后，不會產生斷鏈現象。相對路徑名的寫法及其含義如表1-4-2所示。 2URLURL（Uniform Resource Locator）即統(tǒng)一資源定位符，）即統(tǒng)一資源定位符，WWW上的地址編上的地址編碼，指出了文件在碼，指出了文件在Internet中的位置。它存在的目的在于統(tǒng)一中的位置。它存在的目的在于統(tǒng)一WWW上的地上的地址編碼，給每個網頁指定地址，這樣就不會出現重復或由于編碼不統(tǒng)一而址編碼，給每個網頁指定地址，這樣就不會

48、出現重復或由于編碼不統(tǒng)一而出現無法瀏覽等問題。當用戶查詢信息資源時，只要給出出現無法瀏覽等問題。當用戶查詢信息資源時，只要給出URL地址，地址，WWW服務器就可以根據它找到網絡資源的位置，并將它傳送給用戶的計服務器就可以根據它找到網絡資源的位置，并將它傳送給用戶的計算機。通常，當用戶用鼠標單擊網頁中的鏈接點時，即可將算機。通常，當用戶用鼠標單擊網頁中的鏈接點時，即可將URL地址的請地址的請求傳送給了求傳送給了WWW服務器。服務器。一個完整的一個完整的URL地址通常由通信協(xié)議名、地址通常由通信協(xié)議名、Web服務器地址、文件在服務器服務器地址、文件在服務器中的路徑和文件名中的路徑和文件名4部分組成

49、。例如，部分組成。例如，http:/ 1.4.2 平鋪背景圖像和為圖像添加文字說明的平鋪背景圖像和為圖像添加文字說明的HTML標記標記1設置平鋪背景圖像的HTML標記使用使用標記中的標記中的BACKGROUND屬性，可設置網頁的平鋪的圖像，屬性，可設置網頁的平鋪的圖像，其格式如下：其格式如下：圖像的路徑可以是絕對路徑，也可以是相對路徑。圖像的路徑可以是絕對路徑，也可以是相對路徑。2為圖像添加文字說明的HTML標記使用使用標記中的標記中的ALT屬性可以為圖像添加文字說明，其格式如下：屬性可以為圖像添加文字說明，其格式如下：。 歇后語是一種隱去后文，以前文表示意思的幽默語言。如以歇后語是一種隱去后

50、文，以前文表示意思的幽默語言。如以“泥菩薩過河泥菩薩過河”暗示暗示“自身難保自身難?！薄⒁?、以“圍棋盤里下象棋圍棋盤里下象棋”表示表示“不對路數不對路數”等。源遠流等。源遠流長的中國文化孕育了這種特殊的語言結構，是廣大人民群眾喜聞樂見的語長的中國文化孕育了這種特殊的語言結構，是廣大人民群眾喜聞樂見的語言形式。言形式。在在“俏皮歇后語俏皮歇后語”網頁中顯示了一些比較有意思的歇后語，但是在網頁中網頁中顯示了一些比較有意思的歇后語，但是在網頁中只顯示了前文，當鼠標移到前文上時，才可以顯示該歇后語的后文，只顯示了前文，當鼠標移到前文上時，才可以顯示該歇后語的后文，“俏俏皮歇后語皮歇后語”網頁效果如圖網

51、頁效果如圖1-5-1所示。所示。 圖1-5-1 “俏皮歇后語”網頁的顯示效果 1.5.1 網頁中的基本結構標記網頁中的基本結構標記1網頁基本結構標記（1） ：是：是HTML文檔中最基本的標記，不可缺少。文檔中最基本的標記，不可缺少。表示表示HTML文檔的開始，文檔的開始，表示表示HTML文檔的結束。文檔的結束。（2）：是網頁標題標記，可以提高網頁文檔的可讀：是網頁標題標記，可以提高網頁文檔的可讀性，向瀏覽器提供一個信息。它可以忽略，但一般不予忽略。性，向瀏覽器提供一個信息。它可以忽略，但一般不予忽略。（3）：是網頁名稱標記，是：是網頁名稱標記，是標記內不可缺少的標記，有標記內不可缺少的標記，有

52、標記就一定要有標記就一定要有標記。標記。（4）：是網頁主題內容標記，其內包含了網頁的全：是網頁主題內容標記，其內包含了網頁的全部內容，一般不可缺少。部內容，一般不可缺少。（5）：使用：使用標記中的標記中的BCOLOR屬性，可以設置網頁的背景顏色。使用的格式有以下兩種：屬性，可以設置網頁的背景顏色。使用的格式有以下兩種： 第一種格式中，第一種格式中，RR、GG、BB可以分別取值為可以分別取值為00FF的十六進制數。的十六進制數。RR用于表示用于表示顏色中的紅色成分占多少，數值越大，顏色越深；顏色中的紅色成分占多少，數值越大，顏色越深；GG用來表示顏色中的綠色成分用來表示顏色中的綠色成分占多少；占

53、多少；BB用來表示顏色中的藍色成分占多少。紅、綠、藍三色按一定比例混合，用來表示顏色中的藍色成分占多少。紅、綠、藍三色按一定比例混合，可以得到各種顏色?？梢缘玫礁鞣N顏色。例如，例如，RR=FF，GG=FF，BB=00，表示為黃色。如果，表示為黃色。如果RRGGBB取值為取值為000000，則，則為黑色；為黑色；RRGGBB取值為取值為FFFFFF，則為白色；，則為白色；RRGGBB取值為取值為FF8888，則為淺紅，則為淺紅色。色。第二種格式是直接使用顏色的英文名稱來設定網頁的背景顏色。例如，第二種格式是直接使用顏色的英文名稱來設定網頁的背景顏色。例如，：用來設置網頁的背景顏色為藍色。：用來設

54、置網頁的背景顏色為藍色。：用來設置網頁的背景顏色為紅色。：用來設置網頁的背景顏色為紅色。：用來設置網頁的背景顏色為白色。：用來設置網頁的背景顏色為白色。（6）：是換行標記，表示以后的內容移到下一行，并且是單向標記，沒有：是換行標記，表示以后的內容移到下一行，并且是單向標記，沒有。（7）：是保留文本原來格式的標記。它的作用是將其中的文本：是保留文本原來格式的標記。它的作用是將其中的文本內容按照原來的格式顯示，否則瀏覽器會自動取消文本中的空格。內容按照原來的格式顯示，否則瀏覽器會自動取消文本中的空格。（8）：是粗體標記，可使其中的文字變?yōu)榇煮w。：是粗體標記，可使其中的文字變?yōu)榇煮w。（9）與與：是有

55、序列表標記，其內用：是有序列表標記，其內用標記引導文字，顯示網頁中的這些文字后，文字前會自動加上標記引導文字，顯示網頁中的這些文字后，文字前會自動加上“1”、“2”序號。序號。（10）與與：是無序列表標記，其內用：是無序列表標記，其內用標記引導文字，顯示網頁中的這些文字后，文字前會自動加上標記引導文字，顯示網頁中的這些文字后，文字前會自動加上“”。 2其他常用標記（1）：是正文的第三級標題標記。此外，還有第一、二、：是正文的第三級標題標記。此外，還有第一、二、三、四、五、六級標題標記，分別為三、四、五、六級標題標記，分別為、和和。級別越高，文字越小。級別越高，文字越小。（2）：是段落標記，其作

56、用是將其內的文字另起一段顯示。：是段落標記，其作用是將其內的文字另起一段顯示。段與段之間有一個空行。段與段之間有一個空行。1.5.2 網頁中的文本標記文本屬于網頁中的基本元素，在前面的基本結構標記中已經介紹了部分文文本屬于網頁中的基本元素，在前面的基本結構標記中已經介紹了部分文本標記。下面介紹一些網頁中不經常使用的文本標記，合理使用這些標記本標記。下面介紹一些網頁中不經常使用的文本標記，合理使用這些標記可以使網頁的顯示效果更加出色。可以使網頁的顯示效果更加出色。1邊框包圍的文字可以通過可以通過標記定義文字的邊框。輸入下面的標記定義文字的邊框。輸入下面的THML代碼，可代碼，可以顯示出如圖以顯示

57、出如圖1-5-2所示增加邊框的文字的顯示效果。所示增加邊框的文字的顯示效果。 圖像的大小和邊框圖像的大小和邊框增加了邊框的文字增加了邊框的文字2文字的物理字符標記符樣式物理字符標記符樣式是指標記本身就說明了修飾文字的效果的標記符。常物理字符標記符樣式是指標記本身就說明了修飾文字的效果的標記符。常用的物理字符標記符樣式有黑體標記用的物理字符標記符樣式有黑體標記、斜體標記、斜體標記及下劃線標記及下劃線標記等，常用物理字符標記樣式如表等，常用物理字符標記樣式如表1-5-1所示。所示。 圖1-5-2 增加邊框的文字的顯示效果 2文字的物理字符標記符樣式物理字符標記符樣式是指標記本身就說明了修飾文字的效

58、果的標記符。常物理字符標記符樣式是指標記本身就說明了修飾文字的效果的標記符。常用的物理字符標記符樣式有黑體標記用的物理字符標記符樣式有黑體標記、斜體標記、斜體標記及下劃線標記及下劃線標記等，常用物理字符標記樣式如表等，常用物理字符標記樣式如表1-5-1所示。所示。 3邏輯字符樣式邏輯字符樣式是指標記符本身表示了所修飾效果的邏輯含義的標記符例如，ADDRESS標記符本身的邏輯含義為“地址”，但并沒有說明具體的物體效果。常用的邏輯字符樣式如表1-5-2所示。 使用這些邏輯字符樣式時，只要將需要設置格式的字符括在標記符之間即可。 現在，比較新穎的網站中經常會使用現在，比較新穎的網站中經常會使用Fla

59、sh動畫，最主要的原因是動畫，最主要的原因是Flash動畫動畫可以實現復雜的動畫效果，而且保持很小的文件體積，這非常有利于在網可以實現復雜的動畫效果，而且保持很小的文件體積，這非常有利于在網絡上傳輸。絡上傳輸。在在“動畫放映室動畫放映室”網頁中插入了網頁中插入了Flash動畫，顯示效果如圖動畫，顯示效果如圖1-6-1所示。在播所示。在播放動畫的同時，網頁中也在播放音樂。在網頁中插入音樂后可以使網頁的放動畫的同時，網頁中也在播放音樂。在網頁中插入音樂后可以使網頁的多媒體效果更加出色。多媒體效果更加出色。圖圖1-6-1 “動畫放映室動畫放映室”網頁的顯示效果網頁的顯示效果如果要想在瀏覽器中顯示如果

60、要想在瀏覽器中顯示Flash動畫，前提是計算機中已經安裝了播放動畫，前提是計算機中已經安裝了播放Flash的插件，如果沒有安裝該插件，可以在的插件，如果沒有安裝該插件，可以在http:/ 圖1-6-1 “動畫放映室”網頁的顯示效果 1.6.1 添加背景音樂和插入添加背景音樂和插入Flash動畫的動畫的HTML語言語言1添加背景音樂使用使用標記可以在網頁中插入背景音樂。標記可以在網頁中插入背景音樂。標記可標記可以放在以放在與與標記內的任何地方。引導音樂文件的屬性是標記內的任何地方。引導音樂文件的屬性是SRC，其格式如下：，其格式如下：2在網頁中插入Flash動畫使用使用標記可以在網頁中插入標記可