1.1 HTML簡介

1.1.1 HTML歷史

HTML簡介

HTML（超文本標記語言）來源于SGML（通用標記語言），是一種用于處理Web數據的結構化語言。SGML最早由IBM公司的技術人員開發，它以結構化的方式來描述計算機中的電子文檔。HTML誕生于20世紀90年代初，它使用了SGML中的一部分標記，在經歷了多個版本的變化后，最終由W3C聯盟掌握了HTML語言的標準修改方案，制定了一系列的標準，從而極大程度地推動了因特網及其應用的發展。

W3C代表的是萬維網聯盟，它創建于1994年，致力于實現Web的標準化運行及多項新技術的發布與推廣，其中最重要的規范為HTML、XML與CSS。

HTML的出現給Web帶來了一股新風氣，它使用標記來指明文本的不同內容，描述在Web中出現的元素，包含文本、圖像、聲音及視頻等。

HTML的主要特點如下：

●通過超鏈接聯系所有的頁面，改變了Web頁面以往單一的線性順序方式，頁面在Web中能夠隨意跳轉，超鏈接技術也是Web中的一大突破。

●通過標記處理網頁中的各種信息，不同于傳統的編程語言，HTML標記是一種解釋性的語言，在HTML中標記的使用是固定的，常見的標記僅有幾十個，易學易懂，并且語法要求不嚴格，源代碼能夠直接被瀏覽器所識別。

●通過與CSS樣式表相結合使用，能夠實現網頁中內容與排版的分離，提高網頁開發效率，降低網頁維護工作量。

正是由于HTML的以上優點，它發展迅速，并極大地促進了萬維網的發展，使互聯網遍歷世界各地，改變了人們的生活方式。

圖1-1顯示了HTML標記語言的發展。

圖1-1 HTML標準發展

1.1.2 HTML標記介紹

HTML標記以＜＞尖括號開始，以＜/＞結束，中間為標記內容。文檔以＜HTML＞＜/HTML＞標記表示網頁文檔的開始，以＜head＞＜/head＞標記表示網頁的頭部內容，以＜body＞＜/body＞標記表示網頁的正文部分。常見的HTML文檔書寫結構如下：

＜html＞

＜head＞

＜title＞標題＜/title＞

＜/head＞

＜body＞

正文

＜body＞

＜/html＞

值得注意的是：“＜”“＞”與標記名之間不能有空格或者其他字符。HTML主要包含以下標記。

1.HTML頭部標記＜head＞

HTML中的頭部標記使用成對的＜head＞＜/head＞來描述網頁中的頭部相關信息。其中包含網頁標題標記＜title＞和網頁元數據標記＜meta＞。

（1）＜title＞標記

title元素用于顯示該網頁的標題，常見語法如下：

＜head＞

＜title＞網頁＜/title＞

＜/head＞

（2）＜meta＞標記

meta元素提供了該網頁的元信息，并且只能位于＜head＞內部。它本身定義的信息不會出現在網頁中，而是在原文件中顯示，一個＜head＞中可以包含多個meta。meta標記常見語法如下：

其中語句http-equiv="Content-Type"告知瀏覽器這是一個HTML文檔，語句name="keywords"及name="description"描述該網頁頭部中的關鍵字信息，便于網絡中對該網頁文檔的搜索。

2.HTML正文部分標記＜body＞

HTML網頁的主體內容通常包含在＜body＞＜/body＞之間，在網頁中顯示的文本、視頻、圖像、表格、表單、動畫等各種元素都包含在body元素中。body標記常見語法如下：

＜body＞

正文

...

...

＜/body＞

學習HTML需要了解HTML的文檔格式，掌握標記的使用方法，表1-1列出了HTML中的常用標記并給出其功能。表中標記用大寫字母以便區分，實際使用時常用小寫字母。

表1-1 HTML標的常用標記及其功能

【例1-1】制作HTML標記的網頁，在瀏覽器中顯示如圖1-2所示。

圖1-2 HTML網頁

代碼如下：

＜html＞

＜head＞

＜title＞詩歌＜/title＞

＜/head＞

＜body＞

＜h1＞小池＜/h1＞

＜hr＞

＜p＞

泉眼無聲惜細流，

樹陰照水愛晴柔。

小荷才露尖尖角，

早有蜻蜓立上頭。

＜/p＞

＜/body＞

＜/html＞

在該例中，head標記表示網頁的頭部，title標記表示網頁的標題，body標記表示網頁的正文部分，h1標記表示正文中標題的字體大小，hr標記表示水平線，p標記表示分段，在瀏覽器中顯示時head元素中的內容不會出現在網頁正文中。