雖然已經有很多現成的HTML編輯器可以用，不必再自己編寫HTML檔案，但學習手工編
寫HTML檔案的必要性的理由在於：
1、現在HTML標準一直在改進中，而現成的HTML編輯器並不一定跟得上HTML的潮流。
2、可以看到，用HTML編輯器編出來的HTML檔案結構相當亂，這是因為在編輯過程中，
編輯器並不能真正理會使用者的編輯要求，結果反覆修改後，就留下不少垃圾。
3、自己編寫HTML檔案，可以隨時將HTML的新發展增加進去，而不用受編輯器的限制。
4、HTML是一種很有意思的語言，它能將你的想法在INTERNET上很好地體現出來。
ＨＴＭＬ語句特點：
1. 所有HTML語句大部分都是<TAG></TAG>結構，<TAG>表示開啟標記，</TAG>表示
關閉標記。但有的語句只有描述開始標記，沒有描述結束，如<P>
2. HTML中對文字的大小寫不敏感。
3. 所有語句都可以迴圈嵌套，但要注意嵌套對稱。
例：<h3><center>…….</center></h3> 就是正確的嵌套方法
<h3><center>…….</h3></center> 這種書寫方法將導致編譯錯誤
一、HTML文檔的基本結構
l HTML部分：每個HTML文檔必須以開啟HTML標記開始，以關閉HTML標記結束
<HTML></HTML> 說明其間內容為HTML格式文檔。
l 頭部分：此部分包含文檔的標題、文檔使用的指令碼、樣式表定義等資訊，還可
以包含搜尋工具和索引所要的其他資訊。頭部分必須包含在<HEAD></HEAD> 標記對中
1. <TITLE></TITLE> 其間包含的文字是該HTML的主題，會顯示在視窗的TITLE欄位
。
2. <META>標記，此標記可以設定網頁的編碼、自動重新整理網頁、設定網頁的到期值
u <meta name=”author” content=”…….”>
u <meta name=”keyword” content=”…..”>
u <meta http-equiv=”Expires” content=”mon, 15 sep 2003”>
u <meta http-equiv=”Refresh” content=”10”, url=http://yourlink”>
u <meta http-equiv=”Content-Type” content=”text/html;charset=gb2312”
>
l 本文部分
<BODY></BODY> 其間說明HTML檔案的主體內容。
BACKGROUND=“圖形名” 背景圖形檔案
TEXT=#RRGGBB 文字顏色（一般為黑 #000000）
LINK=#RRGGBB 連結標誌文字顏色
VLINK=#RRGGBB 具有超串連部分顯示的顏色，點過之後為ALINK的顏色
ALINK=#RRGGBB 已經連結標誌文字顏色
ONLOAD=“擴充函數調用串” 與<SCRIPT>一同使用
<- text -> text 是描述性文字，注釋。
<SCRIPT></SCRIPT> 描述一擴充語言。 其中： LANGUAGE=“javascript” 描述以下為Ja
va語言
二、 字 體
<Hy></Hy> (y=1-6) 用於說明各級標題文字，y=1時字型最大，y=6時字型最小。其中：
ALIGN=預設 對左(LEFT)
=CENTER 對中
=RIGHT 對右
<CAPTION></CAPTION> 顯示標題文字（一般用於TABLE顯示表格）
<FONT></FONT> 字型大小設定（NETSCAPE ONLY） 其中：
SIZE=-4 ~ +4 將字型設定為BASEFONT的相對大小
COLOR=#RRGGBB 字型顏色（R、G、B三色）
<BASEFONT></BASEFONT> 設定基本字型（NESCAPE ONLY） 其中： SIZE=1-6
三、字型變化
Italic（斜）字型：
<I></I> 斜體字 <EM></EM> 著重字 <CITE></CITE> 段落、書名的引用
<VAR></VAR> 表明可變內容(如檔案名稱)
Bold（黑）字型： <B></B> 黑體字 <STRONT></STRONG> 加強字,
Fixed width font（緊湊）字型：
<TT></TT> 緊湊字（印表機字型）
<CODE></CODE> 緊湊字
<SAMP></SAMP> 樣本字
<KBD></KBD> 顯示鍵盤上鍵名
其它字型修飾： <U></U> 底線 <BLINK></BLINK> 閃爍字
特殊字元：（ＣＥＲＮ中列表） < < < > > > & & & " "
" ö ñ ± è 《 @ @ (c) （NETSCAPE ONLY）
; （NETSCAPE ONLY） 非中斷空格
四、 段 落
<P> 單獨表示段落結束。 <P></P> 表示其間文字是同一個段落，段落顯示分成若干行，在
何處分行由瀏覽器的視窗寬度決定，可適應任何寬度的視窗。 其中： ALIGN=預設 對左（
LEFT） =CENTER 對中 =RIGHT 對右
<BR> 在頁面上加一個斷行符號。
<HR> 顯示一條水平分界線。 其中：（以下NETSCAPE ONLY）
SIZE=n 高度點數
WIDTH=n 寬度點數 =n% 寬?**計聊話俜直?
ALIGN=預設 對中 =LEFT 對左 =RIGHT 對右
<CENTER></CENTER> 表示其間內容顯示向中間對齊。（NETSCAPE ONLY）
<PRE></PRE> 預設文字格式（Preformatted Text） 其中的文字間隔、跳行、空白照原始
鍵入情形顯示出來，常用於程式的表達。其它標註也允許存在<PRE>中。
<BLOCKQUOTE></BLOCKQUOTE> 區區塊引述設定。其中的文字內容會比其他文字縮排一些。
<ADDRESS></ADDRESS> 地址地區。通常放在最後，包含一個EMAIL地址，告知本頁面作者。
顯示為斜體字。
段落樣本
五、 鏈 接
<A></A> 連結標記。其間文本（映像）將顯示出來，並用連結顏色和底線區別出來
。 其中:
NAME=“position” 表示頁面中position處 HREF=“#position” 表示連結到本頁面posi
tion處
NAME=“filename#position” 連結到filename檔案的position處 =“filename.html” 鏈
接到指定的filename頁面
NAME=“filename.gif” 顯示指定的圖形 圖形格式為GIF、TIEF、JPEG、RGB、HDF等格式
NAME=“scheme://host-domain[:port]/path/filename” 連結到指定主機的指定頁面 sc
heme是http、ftp等 host-domain為伺服器名 port為提供此服務的連接埠號碼，預設為８０，
可省略
六、 圖 像
<IMG></IMG> 顯示映像。 其中:
ALIGN=BOTTOM預設 文本在映像下面
=MIDDLE 在中間 =TOP 在上面
SRC=“映像名” 影像檔
ALT=“text” 映像別名，若映像不顯示時，顯示在虛框內
WIDTH=n 寬度點數 =n% 可顯示面積的百分比
HEIGHT=n 高度點數 =n% 可顯示面積的百分比
BORDER=n 立體邊框厚度點數
HSPACE=“映像名” 水平空間（NETSCAPE ONLY）
VSPACE=“映像名” 垂直空間（NETSCAPE ONLY）
ISMAP 說明本映像為地圖
USEMAP=“#name” 給本映像取一個地圖名
<MAP></MAP> 對一幅地圖進行*作。 其中： NAME=“name” 由<IMG>中指定的地圖名
<AREA></AREA> 地區選取項目。在<MAP>中使用, 其中:
SHAPE=RECT矩形地區，只需提供對角座標(x1,y1,x2,y2),
=POLYGON多邊形，要提供多邊形各頂點座標(x1,y1,...,xn,yn)
COORDS=x1,y1,...,xn,yn 座標值(１０進位)
HREF=連結化物件（參照<A>）
映像樣本
七、 列 表
以下各種排列可以綜合嵌套排列，成為有層次的排列。
<UL></UL> 未標序的排列（Unnumbered Lists） 在其中的每一行文字前加上<LI>，起始會
顯示“●”或“□”或“■”等，具體顯示什麼由具體的瀏覽器決定。
<OL></OL> 標序的排列（Numbered Lists或Ordered Lists） 在其中的每一行文字前加上
<LI>，起始會顯示數字編號。
<LI></LI> 每一行文字的起頭。
<DL></DL> 陳述式排列（Descriptive Lists）
<DT></DT> <DL>中顯示陳述的主題。
<DD></DD> <DL>中顯示敘述的內容，會比<DT>內容縮入一些位置。在<DT>和<DD>中，可包
含其它連結內容。
<DIR></DIR> 顯示清單，每行最多２０個字元。在其中的每一行文字前加上<LI>。
<MENU></MENU> 顯示菜單。在其中的每一行文字前加上<LI>。
八、輸入框（輸入表格）
<FORM></FORM> 說明一個輸入表格。這是從瀏覽器向伺服器發回反饋資訊或互動啟動並執行重
要方式。其中：
METHOD=GET 從伺服器擷取資訊
=POST 發送表格資訊到伺服器
ACTION=“CGI-program” CGI-program是伺服器上一個可執行程式，其介面標準為CGI (C
ommon Gateway Interface)，它將處理瀏覽器發送回來的 填表資訊。 表格中可以使用多
種元件，如輸入框、列表、按鈕等。
<INPUT></INPUT> 輸入框或按鈕選擇。在<FORM>中使用。其中：
SIZE=n 輸入框或按鈕大小
NAME=“name” 便於CGI-program識別的變數名
TYPE=“type” 類型（見下）
=TEXT 文本輸入框，只有一行
=PASSWORD 口令輸入框，輸入的資訊不顯示出來
=CHECKBOX 確任盒（[ ]或[X]）
=RADIO 圓按鈕，幾個同名的RADIO只能按下一個
=SUBMIT 發送按鈕，按動後發出已填好的表格
=RESET 重設按鈕，按動後將所有元件重設為預設值
=IMAGE
=HIDDEN
VALUE=“value” 預設值（見下）
=字串 對於TEXT和PASSWORD
=ON/OFF 對於CHECKBOX和RADIO
=顯示字串 對於SUBMIT和RESET
<TEXTAREA></ textarea> 說明一個可以多行輸入的文本輸入框。其間的常值內容為預設的
文本輸入框內容。 其中：
NAME=“name” 變數名
ROWS=n 輸入框行數
COLS=n 輸入框列數
<SELECT></SELECT> 顯示一個挑選清單。 在其中的每一行文字前加上<OPTION>。其中：
NAME=“name” 變數名
SIZE=1 顯示一個*作菜單（Option Menu） >=2 顯示一個滾動列表（Scrolled List） SI
ZE為列表顯示出來的行數
<OPTION></OPTION> 每一行列表的起頭。在<SELECT>中使用。
九、顯示表格
<TABLE></TABLE> 顯示二維表格。 其中：
BORDER=n 二維表格的立體邊框厚度點數
WIDTH=n 寬度點數 =n% 寬?**計聊話俜直?
CELLPADING=n 是指TABLE中架構與元素的邊界的距離
CELLSPACING=n 表格中每項之間的空間點數，包括橫向和縱向。
<TR></TR> 在表格的每一行開頭加上<TR>(Text Row)。其中：
ALIGN=CENTER 對中
=LEFT 對左
=RIGHT 對右
<TH></TH> 在表格的每一種類項目開頭加上<TH>(Text Head)，顯示為黑體字。
<TD></TD> 在表格的每一個項目開頭加上<TD>(Text Data)。其中：
WIDTH=n 寬度點數
=n% 寬?**計聊話俜直?
HALIGN =CENTER 對中
=LEFT 對左
=RIGHT 對右
VALIGN =TOP 在上面
=MIDDLE 在中間
=BOTTOM 在下面
Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=805063
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
