- 網頁設計與制作教程:Web前端開發(第6版)
- 劉瑞新主編
- 1423字
- 2021-12-17 16:15:04
2.1 基本塊級元素
基本塊級元素包括標題元素、段落元素和水平線元素。
2.1.1 標題元素hl~h6
﹤hl﹥~﹤h6﹥標簽可定義標題。其中,﹤hl﹥定義最大的標題,﹤h6﹥定義最小的標題。由于h元素擁有確切的語義,因此在開發過程中需要選擇恰當的標簽層級構建文檔的結構。通常,﹤h1﹥用于最頂層的標題,﹤h2﹥、﹤h3﹥和﹤h4﹥用于較低的層級,﹤h5﹥和﹤h6﹥由于文檔層級關系很低、字號非常小而很少使用。該標簽支持全局標準屬性和全局事件屬性。
通過設置不同大小的標題,增加文章的條理性。標題元素的格式為:
﹤hn﹥標題文字﹤/hn﹥
n指定標題文字的層級,n取1~6之間的值。
【例2-1】列出HTML中的各級標題。本例文件2-1.html在瀏覽器中的顯示效果如圖2-1所示。


圖2-1 標題示例顯示
在HTML5中,推薦使用CSS設置標題元素的屬性。
2.1.2 段落元素p和換行元素br
段落標簽﹤p﹥…﹤/p﹥定義段落,瀏覽器增加段前、段后的行距。段落的行數會依據瀏覽器窗口的大小而改變。而且如果段落元素的內容中有多個連續的空格(按〈Space〉鍵),或者連續多個換行(按〈Enter〉鍵),瀏覽器都將解讀為一個空格( )。該標簽支持全局標準屬性和全局事件屬性。段落元素的格式為:

3 標題元素h1~h6

4 段落元素p和換行元素br
﹤p﹥段落文字﹤/p﹥
在HTML5中,推薦使用CSS設置段落元素p的屬性。
若要正常地換行,使用﹤br/﹥標簽。﹤br/﹥標簽定義一個換行,通常放在﹤p﹥標簽內。需要注意的是,不要使用﹤br/﹥標簽分段落,它們的語義不同,在瀏覽器中的顯示也不同,﹤br/﹥不會增加段前、段后的行距。換行元素的格式為:
﹤br/﹥
【例2-2】列出包含﹤p﹥標簽的多種屬性。本例文件2-2.html在瀏覽器中的顯示效果如圖2-2所示。


圖2-2 段落、換行示例
﹤h3﹥1.1.1  Web服務器﹤/h3﹥
﹤p﹥Web服務器也稱為WWW(World Wide Web)服務器,一般指網站服務器,WWW是Internet的多媒體信息查詢工具,是Internet上發展最快和目前用得最廣泛的服務。﹤br/﹥正是WWW工具使得近年來Internet迅速發展,且用戶數量飛速增長。﹤/p﹥
﹤p﹥    Web服務器的主要功能是提供網上信息瀏覽服務。﹤br/﹥Web服務器可以解析HTTP,當Web服務器接收到一個HTTP請求時,會返回一個HTTP響應,這樣瀏覽器等Web客戶端就可以從服務器上獲取網頁(HTML),包括CSS、JS、音頻、視頻等資源。﹤/p﹥

2.1.3 水平線元素hr
使用水平線元素hr,可以在瀏覽器中創建一條水平標尺線(Horizontal Rule),可以在視覺上將文檔分割成多個部分。線段的樣式由標簽的參數決定。水平線元素的格式為:
﹤hr/﹥
在HTML5中,推薦使用CSS設置水平線元素的其他屬性(線條粗細、長度、顏色等)。
【例2-3】 水平線元素的基本用法。本例文件2-3.html在瀏覽器中的顯示效果如圖2-3所示。


圖2-3 水平線元素示例

5 水平線元素hr

﹤hr/﹥標簽強制執行一個簡單的換行,將導致段落的對齊方式重新回到默認值設置(左對齊)。在HTML5中,所有﹤hr/﹥標簽的呈現屬性可以使用,但不推薦使用,要想更靈活地控制并美化頁面布局,推薦使用CSS設置。
2.1.4 注釋元素
注釋元素用于在源代碼中插入注釋。注釋的作用是方便自己和項目組的其他人員閱讀和調試代碼,便于以后對自己代碼的理解和修改。當瀏覽器遇到注釋時會自動忽略注釋內容,瀏覽者在瀏覽器中看不見這些注釋,注釋只有在用文本編輯器打開文檔源代碼時才可見。注釋元素的格式為:
﹤!--注釋內容--﹥
注釋并不局限于一行,長度不受限制。結束標簽與開始標簽可以不在一行上。
【例2-4】注釋示例。本例文件2-4.html在瀏覽器中的顯示效果如圖2-4所示。


圖2-4 注釋顯示效果
使用注釋標簽來隱藏瀏覽器不支持的腳本也是一個好習慣,這樣就不會把腳本顯示為純文本。