1、 通過本章學習，應該掌握以下內容：通過本章學習，應該掌握以下內容：HTML及其功能及其功能利用利用HTML創建和測試創建和測試Web頁的方法頁的方法利用利用HTML設置標題和文字設置標題和文字利用利用HTML設置段落設置段落利用利用HTML進行文本格式的處理進行文本格式的處理利用利用FrontPage 2002和和Dreamweaver 4.0處理處理文本文本第第3章章 網頁文本的處理網頁文本的處理 3.1 利用利用HTML處理文本處理文本 HTML基礎基礎1標記符標記符 標記符又稱標簽，標記符又稱標簽，HTML是影響網頁內容顯示格式的標記符集是影響網頁內容顯示格式的標記符集合，瀏覽器根據標記

2、符決定網頁的實際顯示效果。合，瀏覽器根據標記符決定網頁的實際顯示效果。 在在HTML中，所有的標記符都用尖括號括起來。例如，中，所有的標記符都用尖括號括起來。例如，表示表示HTML標記符。絕大多數標記符都是成對出現的，標記符。絕大多數標記符都是成對出現的，包括開始標記符和結束標記符。包括開始標記符和結束標記符。 如：如： .HTML標記符是不區分大小寫的，但通常約定標記符使用大寫字母，標記符是不區分大小寫的，但通常約定標記符使用大寫字母，這有利于這有利于HTML文檔的維護。文檔的維護。 屬性是用來描述對象特征的特性。在屬性是用來描述對象特征的特性。在HTML中，所有的屬性都中，所有的屬性都放置

3、在開始標記符的尖括號里，屬性與標記符之間用空格分隔，放置在開始標記符的尖括號里，屬性與標記符之間用空格分隔，屬性的值放在相應屬性之后，用等號分隔，而不同的屬性之間用屬性的值放在相應屬性之后，用等號分隔，而不同的屬性之間用空格分隔。格式為：空格分隔。格式為： 受影響的內容受影響的內容 HTML屬性通常也不區分大小寫。屬性通常也不區分大小寫。 2HTML文檔的基本結構文檔的基本結構一個典型的一個典型的HTML文本的基本結構形式如下：文本的基本結構形式如下：文本標題文本標題文本內容文本內容上述文檔用到四種標記符，其意義如下：上述文檔用到四種標記符，其意義如下： （1）HTML標記符標記符 這兩個標記

4、符是這兩個標記符是HTML文檔的標記符。文檔的標記符。處于文檔的最前端，表示文檔的開始，即瀏覽器從處于文檔的最前端，表示文檔的開始，即瀏覽器從開始解釋。而開始解釋。而則位于文件的最后一行，這樣則位于文件的最后一行，這樣的結果表示這一整份的文檔都是的結果表示這一整份的文檔都是HTML語法的文檔。語法的文檔。 （2）HEAD標記符標記符 是是HTML文件頭標記符，用來描述文件頭標記符，用來描述HTML首部的內容，說明文檔的整體信息。所有首部信息并不會首部的內容，說明文檔的整體信息。所有首部信息并不會出現在利用出現在利用WWW瀏覽器所看到的窗體中。瀏覽器所看到的窗體中。通常與某些標記符一起使用，如通

5、常與某些標記符一起使用，如標記符。標記符。 （3）TITLE標記符標記符 指的是一份文檔的標題。通常來說，指的是一份文檔的標題。通常來說，每一份文檔都應該有一個標題來簡述這一份文檔的特色或是主題。每一份文檔都應該有一個標題來簡述這一份文檔的特色或是主題。對于對于WWW瀏覽器而言，標題所在的位置雖然依照瀏覽器的不同瀏覽器而言，標題所在的位置雖然依照瀏覽器的不同而不同，但是大部分都位于瀏覽器的最上方。而不同，但是大部分都位于瀏覽器的最上方。 （4）BODY標記符標記符 指的是定義出一個指的是定義出一個HTML文檔的體部，文檔的體部，位于首部下面。在位于首部下面。在標記符內的文字，所有使用標記符的標

6、記符內的文字，所有使用標記符的地方都可以經瀏覽器正確地顯示在瀏覽器窗體中。地方都可以經瀏覽器正確地顯示在瀏覽器窗體中。 3創建和測試創建和測試Web頁頁 由于由于HTML文件的實質就是文本文件，因此可以用任何文本編文件的實質就是文本文件，因此可以用任何文本編輯器編輯輯器編輯HTML文件，通常可以使用文件，通常可以使用Windows系統中的系統中的“記事本記事本”程序。另外，由于程序。另外，由于Windows98Me2000系統中捆綁了系統中捆綁了IE5或或IE5.5（Internet Explorer 5.0或或5.5），因此用戶在），因此用戶在Windows中可中可以方便地對以方便地對Web

7、頁進行簡單的測試。頁進行簡單的測試。（1）創建）創建Web頁頁 保存了保存了Web頁之后，在所選擇的文件夾中將包含所創建的頁之后，在所選擇的文件夾中將包含所創建的Web頁，可以由頁，可以由IE將其打開。將其打開。 （2）發布）發布Web頁頁 用戶創建了用戶創建了Web頁之后，通常可以直接將其保存在硬盤、軟盤頁之后，通常可以直接將其保存在硬盤、軟盤或光盤上，作為一種電子文檔，也可以將其發布到或光盤上，作為一種電子文檔，也可以將其發布到Internet上，上，以便讓全世界的瀏覽者都能夠進行瀏覽。發布以便讓全世界的瀏覽者都能夠進行瀏覽。發布Web頁時應按以下頁時應按以下步驟進行。步驟進行。 創建本地

8、站點創建本地站點 申請網頁空間申請網頁空間 用用FTP上傳網頁上傳網頁 標題處理標題處理 在在HTML中，用戶可以通過中，用戶可以通過Hn標記符來標識文檔中的標題和標記符來標識文檔中的標題和副標題，其中副標題，其中n是是1到到6的數字。的數字。表示最大的標題，表示最大的標題，表示表示最小的標題。使用標題樣式時，必須使用結束標記符。最小的標題。使用標題樣式時，必須使用結束標記符。標題文字標記符的格式：標題文字標記符的格式： 標題文字標題文字 屬性屬性align用來設置標題在頁面中的對齊方式：用來設置標題在頁面中的對齊方式：left（左對齊）、（左對齊）、center（居中）或（居中）或right

9、（右對齊）。（右對齊）。 如如: 計算機系計算機系 標記符默認顯示宋體。標記符默認顯示宋體。標記符會自標記符會自動插入一個空行，不必再用空行標記符。在一個標題行下無法使動插入一個空行，不必再用空行標記符。在一個標題行下無法使用不同大小的字體。用不同大小的字體。 與與HEAD中的中的定義的網頁標題不同，標定義的網頁標題不同，標題格式顯示在瀏覽器窗口內，而不顯示在瀏覽器的標題欄中。題格式顯示在瀏覽器窗口內，而不顯示在瀏覽器的標題欄中。段落處理段落處理 在在HTML中段落處理是通過段落標記來完成的，常用的段落標中段落處理是通過段落標記來完成的，常用的段落標記符有：記符有：1注釋標記符注釋標記符 HT

10、ML的注釋標記符的格式為：的注釋標記符的格式為：2強制換行標記符強制換行標記符 強制換行標記符為強制換行標記符為，放在一行的末尾，可以使后面的文字、，放在一行的末尾，可以使后面的文字、圖片、表格等顯示于下一行，而又不會在行與行之間留下空行，圖片、表格等顯示于下一行，而又不會在行與行之間留下空行，即強制文本換行。即強制文本換行。 3強制換段標記符強制換段標記符 在在HTML文檔中，無法用多個回車、空格、文檔中，無法用多個回車、空格、Tab鍵來調整文檔鍵來調整文檔段落的格式。要用段落的格式。要用HTML的標記符來強制換行、分段。的標記符來強制換行、分段。（1）強制換段標記符）強制換段標記符強制換段

11、標記符的格式為：強制換段標記符的格式為：文字文字（2）設置段落標記符）設置段落標記符設置段落標記符的格式為：設置段落標記符的格式為： 文字文字 4顯示預排格式標記符顯示預排格式標記符 當用其他編輯工具編排好了一段文字后，其中很可能有一些HTML文件不支持的控制符號，如同車、多個空格、Tab鍵等。如果希望在瀏覽網頁時仍保留在編輯工具中已經排好的段落格式，可以使用標記符將預先排好的格式保留下來。 顯示預排格式標記符的格式為：預先排好的格式5分區顯示標記符分區顯示標記符 分區顯示標記符的格式為： 文本或圖像 6水平線水平線 在頁面中插入一條水平標尺線（Horizontal Rules），可以使不同功

12、能的文字分隔開，看起來整齊、明了。 水平線標記符的格式為：文本格式處理文本格式處理文本格式處理包括文字設置和格式處理。文本格式處理包括文字設置和格式處理。1文字設置文字設置 在網頁中為了增強頁面的層次，其中的文字可以用在網頁中為了增強頁面的層次，其中的文字可以用不同的大小、字體、字型和顏色，通常用不同的大小、字體、字型和顏色，通常用FONT標記標記符來完成。符來完成。 FONT標記符設置格式為：標記符設置格式為： 被設被設置的文字置的文字 size屬性是字號屬性，用于控制文字的大小，它的屬性是字號屬性，用于控制文字的大小，它的取值既可以是絕對值，也可以是相對值。取值既可以是絕對值，也可以是相對

13、值。 face屬性是字體標記符，用來指定字體樣式。屬性是字體標記符，用來指定字體樣式。 color屬性可用來控制文字的顏色，屬性值可以是屬性可用來控制文字的顏色，屬性值可以是顏色名稱或十六進制值。顏色名稱或十六進制值。 2格式處理格式處理HTML中的格式標記符有：中的格式標記符有： 標記符之間加入的文本將標記符之間加入的文本將會在瀏覽器中按兩邊縮進的方式顯示出來。會在瀏覽器中按兩邊縮進的方式顯示出來。 標記符是指標記符是指Directory List，用來創建一個普通的列，用來創建一個普通的列表，表，; 用來創建列表中的上層項目；用來創建列表中的上層項目；用來創建列表中最下層項目；用來創建列表

14、中最下層項目；和和都必都必須放在須放在標志對之間。標志對之間。 標記符指標記符指Ordered List，它是用來創建一個標有數字，它是用來創建一個標有數字的列表；的列表；標記符用來創建一個標有圓點的列表；標記符用來創建一個標有圓點的列表；標記符只能在標記符只能在或或標記符標記符內使用，此標記符用來創建一個列表項。內使用，此標記符用來創建一個列表項。 3設置頁面屬性設置頁面屬性（1）設置頁面背景顏色）設置頁面背景顏色 標記符中使用標記符中使用bgcolor屬性可以為網頁設置背景顏色。屬性可以為網頁設置背景顏色。 （2）設置頁面背景圖像）設置頁面背景圖像 單純使用一種顏色作為背景顯然有些單調，網

15、頁設計者也可選單純使用一種顏色作為背景顯然有些單調，網頁設計者也可選擇特定圖案作為頁面的背景，使用擇特定圖案作為頁面的背景，使用BODY標記符的標記符的background屬屬性即可。性即可。HTML語句為：語句為： （3）設置文字和超鏈接的顏色）設置文字和超鏈接的顏色 在設置了背景圖案或背景顏色后，常常需要更改正文字符和超在設置了背景圖案或背景顏色后，常常需要更改正文字符和超鏈接的顏色，以便與背景相適應。設置正文和超鏈接顏色時，可鏈接的顏色，以便與背景相適應。設置正文和超鏈接顏色時，可以使用以使用BODY標記符的標記符的text、link、vlink和和alink屬性。其中，屬性。其中，te

16、xt屬性用于設置正文的顏色；屬性用于設置正文的顏色；link屬性用于設置未被訪問的超鏈接屬性用于設置未被訪問的超鏈接的顏色；的顏色；vlink用于設置已被訪問過的超鏈接的顏色；用于設置已被訪問過的超鏈接的顏色；alink用于設用于設置活動超鏈接（即當前選定的超鏈接）的顏色。置活動超鏈接（即當前選定的超鏈接）的顏色。3.2 其他處理網頁文本的方法其他處理網頁文本的方法利用利用FrontPage 2002處理網頁文本處理網頁文本1輸入文本輸入文本 利用利用FrontPage 2002創建一個網頁后，在文檔的編輯區域內，創建一個網頁后，在文檔的編輯區域內，可以看到閃爍的光標，在此可以輸入文字。在輸入

17、文字的過程中，可以看到閃爍的光標，在此可以輸入文字。在輸入文字的過程中，光標也跟著向后移動。光標也跟著向后移動。 2編輯文本編輯文本 應用應用FrontPage 2002編輯文本的基本操作與其他的文字處理軟編輯文本的基本操作與其他的文字處理軟件有相同之處。常用的文本編輯操作有：選擇、移動、復制、粘件有相同之處。常用的文本編輯操作有：選擇、移動、復制、粘貼、剪切、刪除、查找和替換等。貼、剪切、刪除、查找和替換等。3設置文本格式設置文本格式 在在FrontPage 2002中，不但可以非常靈活地設置各種文本格式，中，不但可以非常靈活地設置各種文本格式，而且可以設置斜體、下劃線、上而且可以設置斜體、

18、下劃線、上/下標、空心、陰影等各種特效。下標、空心、陰影等各種特效。4段落式樣和對齊方式段落式樣和對齊方式（1）段落式樣）段落式樣 FrontPage2002為網頁設計者提供了為網頁設計者提供了16種樣式，其中種樣式，其中6種是段種是段落樣式。落樣式。（2）對齊方式）對齊方式 在格式欄中有在格式欄中有4個按鈕與段落的操作有關，這個按鈕與段落的操作有關，這4個按鈕分別代個按鈕分別代表左對齊、右對齊、居中對齊和分散對齊。表左對齊、右對齊、居中對齊和分散對齊。 5編號列表編號列表 在在FrontPage 2002中，設置編號列表可以利用按鈕和按鈕，中，設置編號列表可以利用按鈕和按鈕，是用默認的標準項

19、目符號，也可以自定義項目符號列表。是用默認的標準項目符號，也可以自定義項目符號列表。 6為段落添加水平線為段落添加水平線Dreamweaver 4.0處理網頁文本處理網頁文本 Dreamweaver 4.0中對文本的輸入及編輯，與中對文本的輸入及編輯，與Word極其相似。極其相似。1編輯文本編輯文本（1）換行）換行 自動換行：在輸入文字時，若某一行的長度超過了自動換行：在輸入文字時，若某一行的長度超過了Dreamweaver窗口的顯示范圍，文字將自動換到下一行。窗口的顯示范圍，文字將自動換到下一行。 利用利用“Enter”鍵換行：在輸入文字后按鍵換行：在輸入文字后按“Enter”鍵，文字成段，鍵，文字成段，且上下段之間空一行。且上下段之間空一行。 利用利用“Shift+Enter”鍵換行：如果想要將文字手動換行，中間又鍵換行：如果想