HTML --- HyperText Markup Language

一. 介紹
1.1 什麼是 HTML??
HTML 是 「HyperText Markup Language」的縮寫。其中的 HyperText 就是『有連結(links)的文字』。而 Markup Language 指的是『標示 語言』，這種語言是包含一個『標籤』所成的集合還有定義這些標籤 所用的文件綜合而成的，而這些標籤是用來標示文件(在這裡，文件指 的就是 HTML 寫成的文件了!)的結構。所以 HTML 的意思可以被說成： 「用來標示 HyperText 文件結構的語言」。而實際上 HTML 包含的不 是只有描述文件結構的標籤，還有文件結構的定義(我們叫它作 DTD -- Document Type Definition)。
二. 架構
2.1 HTML 的文件
我們前面提到，HTML 是用來描述 HyperText 文件的結構用的。在此 我們就要開始提到怎麼樣寫一份 HTML 文件。 
        
            <!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">
            <TITLE>這是一份 HyperText 文件</TITLE>
            <p> 這裡有些 <em>測試 &#42;wow&#42;</em> 用的文字</p>
上面可以說是一份最簡單的 HTML 文件。
2.2 HTML 文件的結構
2.2.1 元素 ( element )
HTML 中的元素指的是資料本身還有描述其中結構的標籤這兩者。例 如說： <em>這一段話是重點</em>。 在這裡面，「這一段話是重點」 是資料，而 <em> 和 </em> 則是標籤。兩者合起來是一個元素。元 素裡面還可以再包含其它的元素。所以一個 HTML 檔案可以說是一堆 元素。
用 HTML 來寫一份文件時，先注意其結構。一個 HTML 檔案通常會有 以下幾個大元素： 
        
          HTML
             |
             +- HEAD
             |
             +- BODY
2.2.2 HTML
這個元素就是宣告這是一份 HTML 檔案，就好像宣告這是一封信件或 是其它什麼文件一樣。
2.2.2 HEAD
顧名思義，在這個部份中，通常會包含整份 HTML 文件的資訊。例如 說作者是誰(email address)、最後更改日期、或與其它文件間的關 係，還有文件的標題等等資訊。在後面我們就會介紹到所須要的標籤。
2.2.3 BODY
這部份就是文件的內容了，裡面是包括文字資料還有 HTML 的標籤。
2.3 HTML 的語法
2.3.1 標籤
前面早已提過 HTML 包含了一堆標籤(當然，它還不只這些。)，而標 籤的功用在於描述文件的結構，例如標示出標題，表列，段落，還有 連結等等。標籤也有分兩種：一是起始標籤(start-tag)；另一個是結 束標籤(end-tag)。在上面的例子中，<em> 是起始標籤，</em> 是結 束標籤。那麼這些標籤要怎樣和使用者原本就打好的文字資料分開呢?? 在此，我們有所謂的「分隔字元」(delimiter)來分隔。我們用 "<" 和 ">" 來分隔起始標籤，而 "</" 和 ">" 來分隔結束標籤。
2.3.2 名字
基本上，每個標籤描述的是不同的結構，所以每個標籤都會有各自的 名字。名字中可以有字母、數字、句點，或是 "-"。不過這些字元的 總長度不超過 72。大小寫是無關緊要的。
注意在開始標籤中名字必定緊接在分隔字元之後。例如 <em> 是正確的，而 < em> 則是錯誤的寫法！
2.3.3 屬性 (attribute)
每個標籤描述的結構並非是一成不變的。所以每個標籤都還有自己的 屬性(attribute)，而每個屬性都可以隨須要設定不同的值。照定義， 每個屬性的值的長度不可超過 1024 字元。所以在一個起始標籤的名 字之後和起始標籤的尾端分隔字元 ( ">" ) 之前，可以把屬性放在 這裡面。例如：

<img src="/images/image.gif" height="320" width="200">

2.3.4 註解 (comment)
要替在 HTML 加註解，我們用 「註解宣告」 (comment declaration) 。就是用 "<!" 作前端分隔字元，後面跟著 0 或多個註解，最後加上 ">" 尾端分隔字元。那每個註解的文字前後用 "--" 包起來。 例如：

<!-- another -- -- comment -->

2.3.5 特殊字元
既然 "<" 和 ">" 被用來當作分隔字元，那當我要印出這兩個字元的時 候該怎麼辦呢?? 這問題當然早就被考慮到了。所以有一個解決的辦法， 我們用一些文字或數字組合起來去對應一些特殊的字元。這叫作「實體 對應」(entity reference)，或「數值字元對應」(numeric character reference)。例如說： 
          
            &amp; 和 &#38; 都對應到 "&" 這符號。
            &lt;  和 &#60;    〃    "<" 這符號。
            &gt;  和 &#62;    〃    ">" 這符號。
這樣就可以解決我們的問題了，甚至我們也可以利用這樣的功能印出一 些鍵盤上無法打出來的字元了!
2.4 HTML 範例和標籤
2.4.1 HTML 範例
以下就是一個簡單的 HTML 文件範例： 
          
          <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
          <HTML>
          <!-- 這裡可以放些註解 -->
          <HEAD>
          <TITLE>HTML 範例</TITLE>
          </HEAD>
          <H1>第一個標題
          <P>這是範例中的一段文字。注意在前面定義的標題(title)是不會出現
          在文件本身中的，一般都出現在瀏覽器視窗的標題槓中。而用 H1 所定
          義的第一個標題則會出現在文件內容中。</p>
          
          <OL>
          <LI>這是個有順序排列的表中的第一項。
          <LI>這是第二項
            <UL>
            <LI>這是無順序排列的表中的一項
            </UL>
          <LI>這是有順序排列表中的第三項。
          </OL>
          <P>以上可以看出，標籤的排列可以是巢狀的(就是標籤中還有標籤)。

          
          <P>這額外的段落是想說明，有些元素中，結束標籤是可以忽略的。例如說
          </P>。但有些不行！並且特殊字元得用<em>特殊方法才能在
          HTML 中表現出來。
          
          <img src="/images/test.gif" alt="Test graph">
          
          </BODY>
          </HTML>
2.4.2 標籤
參看附件
http://www.math.ncu.edu.tw/~chenym/html/tags.html
http://www.dd.ncu.edu.tw/~shiou/html/index.html
Last Modified: