[立即列印]
實用 HTML 語法蒐整
[立即列印]
<標籤名稱 屬性 ="設定值"> ..要顯示之文件資料.. </標籤名稱>
<Tag Attributes ="Value"> ..Document Of Display.. </Tage>
※重要聲明：本篇資料由【網頁研習室】李文能，費時多日編輯；在尊重編者權益下，歡迎
《網路張貼》或《加入鏈結》；為利研習，請閱讀本表[使用說明]。
把這些注意事項及標籤全部學會，您就可以作一個不錯的網站了。
祝研習順利成功 網頁研習室編輯 李文能 敬上 http://www.wepage.idv.tw/study/ 2000.04.22
※注意：本表為考量列印，僅列出重要部份資料；[另詳說明]等跳出視窗並未納入。
標籤名稱、屬性及設定值
簡
介
<! - -Note-
->
註解，不會顯示，可供爾後網頁編輯、修改、查看使用
<! - -DOCTYPE... - ->
文件形式宣告檔案，可省略；另詳說明
<A HREF =" 檔案名稱"、"#錨的名稱"、"TARGET">
A=>Anchor
指定本內容超連結，" 檔案名稱"，可使用相對或絕對路徑，檔案為任何URL所指定格式均可
"#錨的名稱"，與<A NAME="錨的名稱">併用，可用於同頁或與某一頁內的指定位置作連接
TARGET="VALUE"，要開啟超連結的指定視窗方式； 另詳說明
<A NAME="錨的名稱">
被指定連結點的名稱
<ADDRESS>....</ADDRESS>
用來顯示電子郵箱地址，與<BLOCKQUOTE>功能相似
<B>.. .. </B>
粗體字 B=>Bold
<BASE HREF、SIZE、TARGET >
定議於文件檔頭<HEARD>.....</HEARD>內
用來作為<BODY>...</BODY>內超連結位址之預設基本路徑
HREF=" 檔案名稱"，可使用相對或絕對路徑，其檔案為任何URL所指定格式均可
SIZE="阿拉伯數字"，配合<BASEFONT>使用，可改變預設值的字形大小，很少使用
BASE TARGET="NAME"，指定的視窗名稱
<BGSOUND SRC 、LOOP、DELAY>
BGSOUND，宣告為背景音樂，檔案格式可為.MID、.AU、.WAV，僅IE可用，參考<EMBED>
SRC="URL"指定背景音樂的超連結所在目錄位置及檔名
LOOP=" N"，撥放次數，如設"-1"或"INFINITE"可重復撥放；DELAY="
T"，延後撥放秒數
<BIG>.. ..</BIG>
顯示大字體
<BLINK>.. ..</BLINK>
會閃爍的文字，IE不支援此功能
<BLOCKQUOTE>.. ..</BLOCKQUOTE>書信內容預先格式化，與<PRE>相似，每列開頭會空5格
<BODY>.. .. </BODY>
顯示網頁中內容(文件)的本體
<BODY BACKGROUND="圖檔格式"
BGCOLOR=".."
TEXT=".."
LINK=".." VLINK=".."
ALINK="..">
設定網頁內背景顏色或背景圖案，及文字、超鏈結、滑鼠按下鏈結、已被按過鏈結文字顏色
圖檔格式可用JPEG或GIF或PNG；PNG為最新圖檔格式，屬可攜式網路圖像，具有檔案小及
高品質優點，唯目前多數瀏覽器仍未普遍支援；=".."，顏色(COLOR)另詳；目前IE及NS不完全
支援"PNG圖檔"；其他屬性：
MARGINWIDTH="N"
MARGINHEIGHT="N"；設定邊界寬度及高度，N=像數(pixel)
TOPMARGIN="N" LEFTMARGIN="N" RIGHTMARGIN="N"；設定邊緣頂、左、右邊距，N=像數
BGPROPERTIES="FIXED"，讓底圖固定不動，而文字或圖示可捲動，只限IE
4.0版本
<BR>
跳列、段(BREAK ROW)，將後面文件往下移一列
<CENTER>.. .. </CENTER>
文件資料向中對齊的開始與結束
<CITE>.. ..</CITE>
Citation ；斜體字型，用於引經據典的文字
<CODE>...</CODE>
用於列出一段程式碼
<COMMENT>...</COMMENT>
加上註解
<DFN>...</DFN>
正體字形，顯示"定義"文字
<DIV ALIGN>...</DIV>
區塊內標籤，與<PRE>功能相似，有屬性；建議使用
ALIGN=".."，指定【內容】靠齊方式，向LEFT(左)、CENTER(中)、RIGHT(右)
項目清單
<DIR>...</DIR>
列表文字標籤，已很少使用
<DL>..、<DT>、 <DD> ..</DL>
<DL>...</DL>：設定定義列表的宣告開始與結束
(Definition List)
<DT>：設定定義列表的項目(Definition
Term )
<DD>： 設定定義列表的項目內容(Definition
Data)，敘述前面會有2個空格，並可自動調整文字排列
<LI TYPE>.. ..</LI> ，</LI>
可省略；列表的項目(List Item)
TYPE="CIRCLE"空心圓點、"DISC"實心圓點(內定)、"SQARE"實心方塊
<OL START、TYPE>...</OL>指定有序號列表(Ordered
List )的屬性，與<LI>塔配運用，可用於
巢狀架構，亦可加入字型顏色等標籤
START="N"，"N"為設定起始的數字；TYPE="1"、"a"、"A"、"i"、"I"，可與START合併使用
<MENU TYPE>...</MENU>
條列文字(項目清單)標籤的開始與結束，建議少用
<UL TYPE>...</UL>
無序號的列表(Unnumbered List) ，項目開頭無編號
TYPE="CIRCLE"空心圓點、"DISC"實心圓點(內定)、"SQARE"實心方塊
<EM>.. .. </EM>
Emphasis；斜體字型，強調用；一般用於視障者的網站
<EMBED SRC 、 HEIGHT、 WIDTH、LOOP、AUTOSTART、HIDDEN、VOLUME>
EMBED，宣告為背景音樂，格式為.MID、.AU、.WAV，IE及NS均可使用，唯尺寸略有不同
SRC="URL"指定背景音樂的超連結所在目錄位置及檔名
LOOP=" N"，撥放次數，如設-1或INFINITE可重復撥放
HEIGHT=" N"，音樂控制盒高度，NS=60 pixels；WIDTH=" N"，音樂控制盒寬度，NS=150 pixels
AUTOSTART="YES、NO"，撥放方式，也可設為TRUE、FALSE
HIDDEN=" TRUE、FALSE"，音樂控制盒隱藏與否，如設-1或INFINITE可重復撥放
VOLUME=" N"，撥放音量，可有可無；EMBED SRC，其他用法；詳述說明
為免不支援此標籤之瀏覽器，您可加入這個<NOEMBED>..文字說明..</NOEMBED>語法
<FONT COLOR、 FACE、 SIZE>指定字形的屬性，以上這三種屬性，可選擇或一起搭配使用
COLOR指定字形的顏色；顏色(COLOR)另詳
FACE指定文字的字形， FACE="字型名稱"，限IE，系統無指定名稱，則以內定值顯示
SIZE設定文字字體的大小， SIZE="1到7"，內定值3，數字越大字越大，可用+及-來改變大小
表單標籤
<FORM METHOD ACTION> ..表單控制標籤.. </FORM>
設定互動式表單之資料傳送方式
< FORM METHOD、ACTION>，內可含以下欄位各式屬性：
METHOD="GET、POST"，依需要選擇其一；另詳說明
ACTION="URL"指定CGI程式存放的超連結所在目錄位置及檔名，可使用相對或絕對路徑
CGI程式的副檔名為.CGI其下的Perl程式語言，副檔名為.PL，或者根本沒有副檔名
"URL"也可以用Email信箱代替，並不須用到CGI，惟須加入ENCTYPE屬性；另詳說明
《INPUT》輸入文字型表單標籤可分為下面幾種互動性欄位，無結尾標籤
《INPUT》常用屬性9項，且都要使用TYPE及NAME屬性，視況使用VALUE、SIZE等屬性
格式為：<INPUT TYPE=".."、 NAME=".."、
VALUE=".."、 SIZE=".."..>其他屬性另詳說明：
MAXLENGHT=".."、 CHEKED=".."、 READONLY=".."、
DISABLED=".."、 ACCESSKEY="..">
1.TYPE="TEXT"文字的基本欄位： 主要用於文字的輸入；另詳說明
2.TYPE="PASSWORD"密碼的基本欄位： 主要是提供密碼的輸入；另詳說明
3.TYPE="HIDDEN"隱藏用的基本欄位： 無法供填表者使用，主要用於內定資訊傳輸；詳說明
4.TYPE="RADIO"單一選項的基本欄位： 主要用於單一選項時的點選；另詳說明
5.TYPE="CHECKBOX"多重選項的基本欄位：主要用於多重選項時的勾選；另詳說明
6.TYPE="BUTTON"按鈕格式的基本欄位： 有兩個按鈕格式，主要用於清除或送出表單內資料
您也可以使用圖片來代替BUTTON，這是HTML 4.0新增的功能；另詳說明
7.TYPE="IMAGE"圖片的基本欄位： 主要用於將圖片坐標傳輸給CGI處理；另詳說明
8.TYPE="FILE"上傳檔案的基本欄位： 主要用於上傳檔案的資料輸入；另詳說明
註：除了SUBMIT、RESET之外，所有輸入型表單，都要使用的NAME屬性；另詳說明
《SELECT》標選擇式表單標籤，須結尾標籤</SELECT>，每個選項以<OPTION>宣告
《TEXTAREA》多列輸入文字區標籤，須結尾標籤，用COLS及ROWS設定長寬；另詳說明
《FIELDSET》表單加外框與標題，這是HTML
4.0新增的功能(限IE使用)；另詳說明
分割視窗
<FRAMESET ROWS、COLS、FRAMEBORDER、FRAMESPACING、BORDERCOLOR>...</....>
<FRAMESET> .. ..</FRAMESET> ，宣告此為多窗框(分割視窗)語法之開始與結束
ROWS=" X1,X2,.."，宣告設成橫排(上下)多窗框，X為百分比或點數(pixel)；另詳說明
COLS=" X1,X2,.."，宣告設成直排(左右)多窗框，X為百分比或點數(pixel)；另詳說明
FRAMEBORDER="1、0"，設定是(1,內定)否(0)顯示多窗框的邊線；也適用於FRAME標籤
FRAMESPACING="N"，設定多窗框間的分界粗細，N為點數(pixel)，限IE使用
BORDERCOLOR="rrggbb"，設定多窗框間的分界顏色，限IE使用；顏色(COLOR)另詳
<FRAME SRC NAME、MARGINHEIGHT、MARGINWIDTH、NORESIZE、SCROLLING...>
FRAME ，宣告此為指定分割視窗，SRC="URL"，指定此窗框的超連結所在目錄位置及檔名
NAME="指定名稱"，為多窗框命名URL所要開啟的窗框名稱，如TOP、LEFT、RIGHT
MARGINHEIGHT=" N"，設定文件內容與窗框上下邊界預留空白距離，N為點數(pixel)
MARGINWIDTH=" N"，設定文件內容與窗框左右邊界預留空白距離，N為點數(pixel)
NORESIZE，設定此視窗不允許改變(鎖住)窗框大小，未設即表可以用滑鼠來移動他
SCROLLING=" YES、NO、AUTO"，設定窗框是否出現捲軸，內定為AUTO自動決定
FRAMEBORDER="1、0"，設定是(1,內定)否(0)顯示多窗框的邊線；也適用於FRAMESET標籤
以防部份瀏覽器不支援多窗框功能，請於語法最後加上<NOFRAMES>..
..</NOFRAMES>宣告
<Hn ALIGN>.. ..</Hn> ALIGN=".."，指定文字靠齊方式，向LEFT(左)、CENTER(中)、RIGHT(右)
設定文字大小，n="1、2、3、4、5、6、7"，內定值3，數字越大字越小，自動分段呈粗體字
<HEAD>.. .. </HEAD>
標示文件檔頭資訊的開始與結束
<HR ALIGN、COLOR、NOSHADE、SIZE、WIDTH>
指定線段的屬性，以上這五種屬性，可選擇或一起搭配使用
ALIGN=".."，指定【線段】靠齊方式，向LEFT(左)、CENTER(中)、RIGHT(右)
COLOR指定線段的顏色，NC不支源此功能；顏色(COLOR)另詳
NOSHADE，指定線段無陰影，內定值是有陰影效果(立體感)
SIZE="N"，指定線段厚度，"N"=數字，數字越大線段越粗(內定值為1)
WIDTH="X"，指定線段長度，"X"=百分比或點數，沒指定則以100%來顯示
百分比：採瀏覽器相對值，寬度隨瀏覽器改變；點數：寬度是固定的，不隨瀏覽器改變
<HTML> .. .. </HTML>
宣告本內容為Html語法(文件)的開始與結束
<I>.. ..</I>
Italic斜體字
<IFRAME SRCNAME、WIDTH、HEIGH、ALIGN</IFRAME>
FRAME的另一種新標籤，可惜的是：目前為止只有IE5.0支援此語法
NAME="FLOAT"，設定為懸浮窗框的命名
WIDTH="N"懸浮窗框的寬度，單位為點數(pixel)；HEIGH="N"懸浮窗框的高度，單位為pixel
ALIGN=".."懸浮窗框的位置，向LEFT(左)、CENTER(中)、RIGHT(右)
<ISINDEX>.. ..</ISINDEX>
定義查詢用表單；ISINDEX PROMP="提示文字"
圖形影像檔
<IMG SRC ALIGN、ALT、BORDER、 HEIGHT、
WIDTH、 HSPACE、 LOWSRC、USEMAP、
VSPACE> ；<IMG.....>宣告此為圖形影像檔標籤，</IMG>，結尾標籤，可有可無
這些均為指定圖片屬性，可配合需要搭配使用；SRC="URL"指定圖形影像的超連結所在目錄
位置及檔名
ALIGN=".."指定圖形影像的位置；另詳說明；ALT=".."圖形影像的內容文字說明；另詳說明
BORDER="N"圖形影像四周的邊框寬度，單位為點數(pixel)
HEIGHT="N"圖形影像的高度，單位為pixel；WIDTH="N"圖形影像的寬度，單位為pixel
HSPACE="N"指圖形影像左、右兩旁水平方向與文字間的空隙，單位為點數(pixel)
LOWSRC=".."先顯示較低解析度圖片，再展現出細圖全貌；另詳說明
USEMAP="圖片名稱"為影像地圖屬性，宣告本圖為用戶端使用，所定名稱與MAP
NAME同
VSPACE="N"指圖形影像上、下兩端垂直方向與文字間的空隙，單位為點數(pixel)
<KBD>...</KBD>
KeyBoard；表示使用者輸入文字
<LINK REL、REV、HREF、TITLE>，必須放於<HEAD>....</HEAD>內
LINK可用於指定，作者信箱、網址及文件樣式(Style Sheel)等的位置
REL=LINK的正向關聯；另詳說明：REV=LINK的反向關聯；另詳說明
HREF="URL"，指定被超連結所在目錄位置及檔名；TITLE=姓名；另詳說明
<MAP NAME="圖片名稱"><AREA
SHAPE="形狀"、HREF="檔名"、COORDS="坐標"></MAP>
MAP 宣告整張地圖為影像地圖， </MAP>，結尾標籤，最好不要省略
影像地圖語法後面的<IMG SRC="URL" USEMAP="圖片名稱"
>可選擇加與否
NAME="圖片名稱"定義影像地圖名稱；AREA="選取區塊範圍的宣告"，本圖內可設多處區塊
SHAPE="選取區塊的形狀"，分三種形狀"RECT"長方形、"CIRCLE"圓形、"POLY"多邊形
HREF="URL"指定影像地圖的超連結所在目錄位置及檔名
COORDS="X1,Y1,X2,Y2""選取區塊的坐標"，單位為點數(pixel)
USEMAP="圖片名稱"影像地圖屬性，宣告為用戶端地圖，所定名稱與相同MAP
NAME即可
另外您也可以加入ALT=".."影像地圖的內容文字說明
或加入TARGET="VALUE"，要開啟超連結的指定視窗方式，詳< A HREF
=".."語法
電子看板
<MARQUEE>..WIDTH、HEIGHT、HSPACE、VSPACE、SCROLLAMOUNT....</MARQUEE>
<MARQUEE>.. ..</MARQUEE>，宣告本語法為(IE專用)電子看板(跑馬燈)，開始與結束標籤
WIDTH="N"，設定電子看板的長度，單位pixel；HEIGHT="N"，設定看板的高度，單位為數
HSPACE="N"，設定電子看板左右兩端預留空白邊界，單位為點數(pixel)
VSPACE="N"，設定電子看板上下兩端預留空白邊界，單位為點數(pixel)
SCROLLAMOUNT="N"，設定電子看板中文字移動的距離，單位為點數(pixel)
BGCOLOR="rrggbb"，設定電子看板中底色，；顏色(COLOR)另詳
LOOP="N"，設定電子看板中字幕重覆移動的次數，內定為無限次
SRCOLLDELAY="T"，設定字幕每隔多久時間移動一次，單位為千分之一秒
ALIGN=".."，設定字幕在電子看板中的位置，靠TOP(上)內定、MIDDLE(中)、BOTTOM(下)
DIRECTION=".."，設定字幕在看板中的移動方向，LEFT(由右往左移動)內定、RIGHT(反之亦然)
BEHAVIOR=".."，設定字幕在看板中的移動方式；另詳說明
<META CHARSET、CONTENT、NAME、HTTP-EQUIV、URL>，必須放於<HEAD>....</HEAD>內
META其主要功能在提供搜索引擎檢索、文件轉換宣告；(另詳說明)、內文等資料記載等
CHARSET採用字元編碼；另詳說明
CONTENT所述內容，如：="TEXT/HTML;CHARSET=BIG5"(純文字/超文字;字元編碼為大五)
NAME(資訊的名稱)與HTTP-EQUIV(標題的名稱)用法相同=設定值，常與CONTENT及URL屬性
搭配使用，將檔案資訊傳給伺服器；URL=要超連結之檔案位置與檔名
<NOBR>.. ..</NOBR>
強迫不跳列；更細說明
<NOFRAME>.. .. </NOFRAME>
定義不能出現分割視窗時，告知的文字顯示
<P ALIGN>.. .. </P> ； </P>可省略
Paragraph分列、段(ROW)，也就是連續跳列兩次<BR>
設定對齊方向，ALIGN=".."，指定【線段】靠齊方式，向LEFT(左)、CENTER(中)、RIGHT(右)
<PERSON>...</PERSON>
顯示人名
<PRE>.. .. </PRE>
將文字排列，以其原貌顯示出來；更細說明
<S>...</S>
文字加刪除線
<SAMP>...</SAMP>
用於引用字
<SMALL>.. ..</SMALL>
顯示小字體
<STRIKE>.. ..</STRIKE>
文字加橫線
<STRONG>.. ..</STRONG>
粗體字型，用於加強語氣；一般都用於提供視障者的網站
<SUB>.. ..</SUB>
下標字型
<SUP>.. </SUP>
上標字型
表格標籤
<TABLE..BORDER、BORDERCOLOR、CELLSPACING、CELLPADDING、WIDTH、HEIGHT
</..>
<TABLE>... </TABLE>【表格】標籤的開始與結束宣告，表格設計原則為由左而右，由上而下
BORDER="N"，指定表格【邊框】的粗細，"N"為數字，越大就越粗
ORDERCOLOR="COLOR"，指定表格邊框的顏色
ORDERCOLORDARK="COLOR"，指定表格暗面邊界顏色
ORDERCOLORLIGHT="COLOR"，指定表格光面邊界顏色；顏色(COLOR)另詳
CELLSPACING="N"，指定表格【內框線】的粗細，"N"為數字，越大就越粗
CELLPADDING="N"，指定表格【格框與內容】的空隙，"N"為數字，越大就越遠
WIDTH="N"，指定表格的【寬度】，"N"為點數(pixel)或百分比(%)
HEIGHT="N"，指定表格的【高度】，"N"為數點數(pixel)或百分比(%)
<TD>.. ALIGN、 BGCOLOR、COLSPAN、 ROWSPAN、NOWRAP、VALIGN、WIDTH..</TD>
<TD>.. </TD>..宣告表格資料【DATA】欄位的開始與結束
ALIGN=".."，指定欄位內【資料】靠齊方式；另詳說明
BGCOLOR=".."，設定欄位內顏色，顏色另詳，同時可用於<TABLE>、<TH>、<TR>標籤
COLSPAN="N"，設定【欄位】向右合併(延伸)，"N"為合併數目，限用於<TH>、<TD>標籤
HEIGHT="N"，指定欄位中的【高度】，"N"為點數，同時可用於<TABLE>、<TH>、<TR>標籤
ROWSPAN="N"，設定【列位】向下合併(延伸)，"N"為合併數目，限用於<TH>、<TD>標籤
NOWRAP，強制格子內的內文寬度不受瀏覽器視窗寬度影響
VALIGN=".."，指定欄位內資料靠齊方式；另詳說明；WIDTH="X"，指定欄位中的寬度；
<TH>...</TH>
表格列中標題【HEAD】欄的開始與結束宣告，呈粗體置中，請參考<TD>標籤
<TR>...</TR>
表格中列【ROW】的開始與結束宣告，請參考<TD>標籤
<CAPTION>.. VALIGN..</CAPTION>
<CAPTION>.. </CAPTION>..宣告表格標題的開始與結束
VALIGN=".."，控制標題資料位置，TOP(上方)及BOTTOM(底部)
<TITLE>.. .. </TITLE>
宣告文件標題的開始與結束，盡量明確簡短(64個字元)
<TT>.. .. </TT>
Teletype，打字機字體
<U>.. .. </U>
Underline，文字加底線
<VAR>...</VAR>
Variable，斜體字型，用於顯示變數
網頁研習室 李文能 版權所有 http://www.wepage.idv.tw/study/ 2000.04.22