1、HTML與CSS前臺頁面設計HTML網頁主體與內容標記 第4章HTML與CSS前臺頁面設計HTML與CSS前臺頁面設計第4章 HTML網頁主體與內容標記 HTML與CSS前臺頁面設計本章要點 標題與段落標記的使用 文本格式標記的使用 與標記的使用 HTML中特殊字符的使用 http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/www.xunchi- http:/ http:/ http:

2、/ http:/ http:/ http:/ http:/ http:/ http:/ / http:/ http:/ http:/ http:/ http:/ http:/ http:/www.gz- http:/www.gz- http:/ http:/ http:/ http:/ 4.1 標題與段落標記的使用 4.2 文本格式標記的使用 4.3 內容（多用途）標記 4.4 特殊字符 4.5 綜合實例第4章 HTML網頁主體與內容標記 HTML與CSS前臺頁面設計4.1 標題與段落標記的使用 4.1.1 h1、h2、h3、h4、h5與h6一般文章都有標

3、題、副標題、章和節等結構，HTML中也提供了相應的標題標記,其中n為標題的等級，HTML總共提供六個等級的標題，n越小，標題字號就越大。hn標記一般格式為：標題 （n=1,6）說明：的屬性有color、align。分別標識標題的顏色和位置(左、右、中間)。 HTML與CSS前臺頁面設計4.1.2 p為了排列的整齊、清晰，文字段落之間，常用來做標記。是HTML格式中特有的段落元素。在HTML格式里不需要在意文章每行的寬度，不必擔心文字是不是太長了而被截掉，它會根據窗口的寬度自動轉折到下一行。因此，在原始文件中的，指出在這兒告一段落，下面的文字另起一段。如果沒有遇到這個符號，它就會把所有的文字都擠

4、在一個段落里，不遇到窗口邊界是不會換行的。段落標記里面可以加入文字,列表,表格等。文件段落的開始由來標記，段落的結束由來標記，是可以省略的，因為下一個的開始就意味著上一個的結束。標記一般格式為：文本說明：標簽有一個常用屬性align，它用來指名字符顯示時的對齊方式，其值一般有left（左）、center（中）、right（右）三種。 4.1 標題與段落標記的使用 HTML與CSS前臺頁面設計4.1.3 blockquote標記可定義一個塊引用。與之間的所有文本都會從常規文本中分離出來，經常會在左、右兩邊進行縮進，而且有時會使用斜體。也就是說，塊引用擁有它們自己的空間。標記一般格式為：文本4.1

5、 標題與段落標記的使用 HTML與CSS前臺頁面設計4.1.4 address可定義一個地址（比如電子郵件地址）。使用它來定義地址、簽名或者文檔的作者身份。不論創建的文檔是簡短扼要還是冗長完整，都應該確保每個文檔都附加了一個地址，這樣做不僅為讀者提供了反饋的渠道，還可以增加文檔的可信度。標記一般格式為：文本 4.1 標題與段落標記的使用 HTML與CSS前臺頁面設計4.1.5 pre標記可定義預格式化的文本。被包圍在標記中的文本通常會保留空格和換行符，而文本也會呈現為等寬字體。標記的一個常見應用就是用來表示計算機的源代碼。標記一般格式為：文本塊4.1 標題與段落標記的使用 HTML與CSS前臺

6、頁面設計4.2 文本格式標記的使用 4.2.1 em標記用來表示強調，其文本默認樣式為斜體。標記一般格式為：文本HTML與CSS前臺頁面設計4.2.2 strong標記把文本定義為語氣更強的強調的內容。其文本默認樣式為粗體。標記一般格式為：文本 4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.3 cite標記定義引用?？墒褂迷摌擞泴⒖嘉墨I的引用進行定義，比如書籍或雜志的標題。標記一般格式為：文本 4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.4 i與b與標記均是字體樣式元素。顯示斜體文本效果，呈現粗體文本效果。與標記一般格式為：文本文本 4.2 文本格式標記

7、的使用 HTML與CSS前臺頁面設計4.2.5 big與small與標記也是字體樣式元素。呈現大號字體效果，呈現小號字體效果。與標記一般格式為：文本文本4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.6 tt標記呈現類似打字機或者等寬的文本效果。標記一般格式為：文本4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.7 sup與sub與標記均是用于數學公式、科學符號和化學公式中的標記。標記可定義上標文本，標記可定義下標文本。標記一般格式為：文本 文本說明：與標記中的文本內容將會以當前文本流中字符高度的一半來顯示，但是與當前文本流中文字的字體和字號都是一樣的。標記中的

8、文本出現在當前文本流的上方，而標記中的文本出現在當前文本流的下方。4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.8 q標記可定義一個短塊的引用。標記一般格式為：文本說明：與的區別，標記在本質上與是一樣的。不同之處在于它們的顯示和應用。標記用于簡短的行內引用。如果需要從周圍內容分離出來比較長的部分（通常顯示為縮進的塊），請使用標記。 4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.9 dfn標記定義一個項目?？蓸擞浤切μ厥庑g語或短語的定義?，F在流行的瀏覽器通常用斜體來顯示中的文本。標記一般格式為：文本 4.2 文本格式標記的使用 http:/ http:/ h

9、ttp:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/www.xunchi- http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ / http:/ http:/ http:/ http:/ http:/ http:/ http:/www.gz- http:/www.gz- http:/ http:/ htt

10、p:/ http:/ abbr與acronym標記表示一個縮寫形式，用于表示web頁面上的簡稱。標記最初是在 HTML4.0中引入的，表示它所包含的文本是一個更長的單詞或短語的簡寫形式。瀏覽器可能會根據這個信息改變對這些文本的顯示方式，或者用其他文本代替。標記一般格式為：文本簡稱 4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.11 del與ins標記定義文檔中已被刪除的文本。標記一般格式為：文本標記定義已經被插入文檔中的文本。標記一般格式為：文本說明：與標簽配合使用，來描述文檔中的更新和修正。4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.12 bdo標記可重

11、新定義文字顯示方向。標記一般格式為：文本4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.13 code、kbd、samp與var、與標記常用于顯示計算機/編程代碼。這幾個標記不只是讓用戶更容易理解和瀏覽的文檔，而且將來某些自動系統還可以利用這些恰當的標簽，從的文檔中提取信息以及文檔中提到的有用參數。提供給瀏覽器的語義信息越多，瀏覽器就可以越好地把這些信息展示給用戶。4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.2.14 hr標記在HTML頁面中創建一條水平線。可以在視覺上將文檔分隔成各個部分。標記一般格式為：4.2 文本格式標記的使用 HTML與CSS前臺頁面設計

12、4.2.15 marquee滾動字幕的使用使得整個網頁更有動感，顯得很有生氣。用HTML的滾動字幕標簽所需的代碼最少，能夠以較少的下載時間換來較好的效果。標記一般格式為：滾動字幕4.2 文本格式標記的使用 HTML與CSS前臺頁面設計4.3 內容（多用途）標記4.3.1 divdiv是division的簡寫，division意為分割、區域。標記在HTML中表示一個塊，標記可以把文檔分割為獨立的、不同的部分，因而該標記被稱為區隔標記?？梢詫⑺米鱓eb頁面的組織工具，設定頁面文字、圖形、圖像、表格等的擺放位置?？梢酝ㄟ^CSS樣式(style)為其賦予不同的表現。div標記一般格式為：文檔HTML

13、與CSS前臺頁面設計4.3.2 span標記在HTML中表示一個組合文檔中的行內元素，標記可以把一行文檔中的某部分分割為獨立的區域，從而實現某種特定效果，因而該標記被稱為行內區隔標記。標記一般格式為：文檔4.3 內容（多用途）標記HTML與CSS前臺頁面設計4.4 特殊字符特殊字符是指在HTML中具有特別含義的字符，比如小于號就表示HTML標記的開始，這個小于號是不會顯示在最終看到的網頁里面。那如果希望在網頁中顯示一個小于號，該怎么辦呢？這時就需要使用一些特殊的代碼組合來替代。在HTML中特殊字符是不能直接使用的。要使用特殊字符，應使用它們的轉義序列。在超文本標記語言里，一個特殊字符有兩種表達

14、方式，即字符轉義序列或數字轉義序列。HTML與CSS前臺頁面設計所謂字符轉義序列，實際上就是用有意義的名稱來表示特殊字符，通常由前綴“&”，加上字符對應的名稱，再加上后綴“;”而組成。其表達方式如下：&name；其中name是一個用于表示字符的名稱，它是區分大小寫的。例如：& lt; font &lgt;顯示為，若直接寫為“則被認為是一個標注。4.4 特殊字符HTML與CSS前臺頁面設計所謂數字轉義序列，就是用數字來表示文檔中的特殊字符，通常由前綴“&#”，加上數值，再加上后綴“;”而組成。其表達方式如下： &#D；其中D是一個十進制數值4.4

15、特殊字符HTML與CSS前臺頁面設計4.5 綜合實例 本節將結合本章所學的內容來制作一個簡單的關于HTML文本格式標記的網頁。網頁內容如圖所示：HTML與CSS前臺頁面設計小結 文本是HTML網頁中的重要內容之一，編寫HTML文檔時，可以將文本放置在標記之間來設置文本的格式。設置文檔中文本的格式內容包括分段與換行、設置段落對齊方式、設置字體、字號和文本顏色以及設置字符樣式等。本章學習了HTML語言的標題與段落標記、文本格式中的常用標記以及與標記，HTML語言中特殊字符的組成結構和使用的方法。使用這些標記，告訴Web瀏覽器如何對文本進行格式化和顯示，如何對網頁元素進行分割和標記，以形成文本的布局、文字的格式及美觀簡潔的版面。 HTML與CSS前臺頁面設計HTML網頁主體與內容標記 第4章本章結束http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http:/ http: