任何採用HTML 3.2規範的文件,開頭都必須利用<!DOCTYPE定義,定義方式如下行:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
SGML關於HTML 3.2的定義有下列幾種:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN" HTML32.dtd>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Draft//EN" HTML32.dtd>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN" HTML32.dtd>
<!DOCTYPE HTML PUBLIC "ISO 8879-1986//ENTITIES Added Latin 1//EN//HTML" ISOlat1.ent>
標準的HTML結構如下:
<HTML>
<HEAD>
<TITLE>A study of population dynamics</TITLE>
... other head elements
</HEAD>
<BODY>
... document body
</BODY>
</HTML>
HEAD區間支援的元素:
TITLE:文件標題,為必需項目
<TITLE>Hello,Title</TITLE>
ISINDEX:提供關鍵字搜尋,後續版本已經移除此項目
<ISINDEX PROMPT="不建議在使用囉">
BASE:提供文件內需要解釋相對路徑時,不再用當前URL,改由此處定義的URL為參考網址
<BASE href="http://sheauren.com.tw"> <!-- 定義相對路徑解釋基礎 -->
<BASE target="_blank"> <!-- 定義何處打開link -->
SCRIPT:保留給Script文件定義
STYLE:保留給Style文件定義
META:以Key/Value Pair的方式,定義文件內資訊
<META NAME="KEYWORDS" CONTENT="HTML,ASP,PHP,SQL" >
<META HTTP-EQUIV="EXPIRES" CONTENT="31 DEC 2011">
LINK:定義文件與外部資源之間的關係
<LINK REL="STYLESHEET" TYPE="TEXT/CSS" HREF="THEME.CSS" />
BODY區間內支援的元素:
標題元素(H1 - H6):不同字型大小的標題由最大(H1)到最小(H6)共六種
<H1>Main Title<H1><H3>Sub Title</H3>
住址元素(ADDRESS):提供定義信箱/聯絡方式/通訊地址時使用
<ADDRESS>Written by sheauren
<A HREF="mailto:sheauren@nomail.org">Email us</A>
</ADDRESS>
區塊(排版)元素:
- 無順序列表(UL):搭佩<LI>描述項目顯示無順序列表
<UL>
<LI>項目A</LI>
<LI>項目B</LI>
<LI>項目C</LI>
<LI>項目D</LI>
</UL>
- 有順序列表(OL):搭配<LI>描述項目顯示有順序列表
<OL>
<LI>項目1</LI>
<LI>項目2</LI>
<LI>項目3</LI>
<LI>項目4</LI>
</OL>
- 定義列表(DL):搭配<DT>定義項目名稱,<DD>定義項目說明來顯示定義列表
<DL>
<DT>ITEM 1</DT>
<DD>DESC 1</DD>
<DT>ITEM 2</DT>
<DD>DESC 2</DD>
</DL>
- 原始內容(PRE):保留區塊內文字原本定義的空白與換行排版
<PRE>裡面的內容,
換行跟空白都會
完整保留下來。<PRE>
- 文件區塊(DIV):提供文字切割,用以獨立定義一個區塊內排版方式(置左/置中/置右)
<DIV align="right">文字置右對齊</DIV>
- 文字置中(CENTER):定義包含內容的文字對齊中間
- 引用元素(BLOCKQUOTE):定含文字為引用說明,一般瀏覽器會以內縮方式呈現
<BLOCKQUOTE>引用元素內文,可能會縮排或者斜體字</BLOCKQUOTE>
- 表格元素(FORM):提供與後端資訊交換的定義,利用FORM FIELDS儲存傳遞內容,傳遞資料置後端
<FORM action="register.pl" method="GET" ></FORM>
- ISINDEX:定義FORM與後端資訊交換的內容,此標記未來已經取消,所以不要在使用
<ISINDEX PROMPT="不建議在使用囉">
- 標格(TABLE):利用CAPTION定義標題;TR定義資料行;TD定義資料格,繪置出所需表格
<TABLE>
<CAPTION></CAPTION>
<TR>
<TD></TD>
<TD></TD>
<TR>
<TR>
<TD></TD>
<TD></TD>
<TR>
</TABLE>
文字元素:
- 字型風格定義(FONT):利用特定標記定義文字風格
<TT>等寬文字,在HTML5時不支援<TT>
<I>斜體字</I>
<B>粗體字</B>
<U>上底線</U>
<STRIKE>刪除線</STRIKE>
<BIG>放大字型</BIG>
<SMALL>縮小字型</SMALL>
<SUB>文字下標</SUB>
<SUP>文字上標</SUP>
- 片語風格定義(PHASE):當需要強調特定詞彙時使用
<EM>特別強調此文字</EM>
<STRONG>更加強調此文字</STRONG>
<DFN>定義此項目</DFN>
<CODE>定義此文字為程式碼</CODE>
<SAMP>特別強調定義,此標籤很少使用</SAMP>
<KBD>定義這是使用者輸入的內容</KDB>
<VAR>定義這是變數/參數/命令列</VAR>
<CITE>定義這是引用資料</CITE>
- 表格欄位(Form Fields):提供使用者輸入允許回傳到後端的資料欄位
<INPUT TYPE="TEXT"> <!--單行文字區塊-->
<INPUT TYPE="PASSWORD"> <!--單行密碼區塊-->
<INPUT TYPE="CHECKBOX"> <!--多選欄位-->
<INPUT TYPE="RADIO"> <!--單選欄位-->
<INPUT TYPE="SUBMIT"> <!--傳送到後端按鈕-->
<INPUT TYPE="IMAGE"> <!--圖形區塊-->
<INPUT TYPE="RESET"> <!--重置資料-->
<INPUT TYPE="FILE"> <!--檔案上傳-->
<INPUT TYPE="HIDDEN"> <!--隱藏欄位-->
<SELECT > <!--下拉式選單-->
<SELECT multiple="multiple"> <!--欄位清單-->
<TEXTAREA></TEXTAREA > <!--多行文字區塊-->
<A HREF='HTTP://WWW.GOOGLE.COM.TW'>GOOGLE</A>
- APPLET定義(APPLET):設定嵌入JAVA APPLET
<applet code="Bubbles.class" width=500 height=500>
Java applet that draws animated bubbles.
</applet>
<FONT SIZE="5" COLOR="#FF0000">紅色3號字型</FONT>
- 定義本文件字型元素(BASEFONT):在HTML5時不支援
<BASEFONT SIZE="5" COLOR="#FF0000">紅色3號字型</BASEFONT>
- 地圖元素(MAP):於圖片中定義一個以上特定區塊具備超連結
<MAP NAME="MAP1">
<AREA HREF=GUIDE.HTML ALT="ACCESS GUIDE" SHAPE=RECT COORDS="0,0,118,28">
<AREA HREF=SEARCH.HTML ALT="SEARCH" SHAPE=RECT COORDS="184,0,276,28">
<AREA HREF=SHORTCUT.HTML ALT="GO" SHAPE=RECT COORDS="118,0,184,28">
<AREA HREF=TOP10.HTML ALT="TOP TEN" SHAPE=RECT COORDS="276,0,373,28">
</MAP>
沒有留言:
張貼留言