html5全解析 · java/android朝圣之路

htm是軟件開發中非常基礎的知識，也是很重要的知識，在web中是很重要的知識點，在此梳理一下主要內容： ## 1、HTML是什么？全稱為HyperText Markup Language,超文本標記語言，非編程語言。 XHTML：功能和HTML差不多，但書寫要求比HTML嚴格。 dhtml：動態頁面：js+csss+html=dhtml ## 2、HTML的基本架構？以下 HTML Source Code 便是一份 HTML 文件的基本架構： ~~~ <HTML> <HEAD> <TITLE> 網頁的標題 </TITLE> </HEAD> <BODY> 網頁的內容，很多標記都作用于此 </BODY> </HTML> ~~~ 特點解說： * 整份文件處于標記與之間。? 用以聲明這是 HTML 文件，讓瀏覽器認出并正確處理此 HTML 文件。 * 文件分兩部分，由至稱為開頭，至稱本文。? 基本上兩者各有適用的標記，如只可出現于開頭部分。 * 開頭部分用以存載重要資訊，而只有本文部分會被顯示。? 所以大部分標記會運用于本文部分。 * 所標示的是文件的標題。? 會出現于瀏覽器頂部及為別人 Bookmark 時的名稱，所以每頁有不同而明確的標題是需要的。上述標記中只有具參數設定。 ~~~ ■ <BODY> 之參數設定： ~~~ 例子： <BODY text="#000000" link="#0000FF" alink="#FF0000" vlink="#0000FF" background="bg1.gif" bgcolor="#FFFFFF" leftmargin=2 topmargin=2 bgproperties="fixed"> * text="#000000"? 用以設定文字顏色。?#000000?代表黑色，亦可以采用顏色的名稱，即 text="black" 。 * link="#0000FF"? 設定一般文字連結顏色。 * alink="#FF0000"? 設定剛按下時文字連結顏色。 * vlink="#0000FF"? 設定連結后的顏色。（被按過）。 * background="bg1.gif"? 設定背景墻紙。GIF 或 JPEG 皆可，可以是絕對途徑或相對途徑。 * bgcolor="#FFFFFF"? 設定背景顏色。當己設定背景墻紙時會失去作用，除非墻紙有透明部分。 * leftmargin=2? 設定整份文件顯示畫面的左方邊沿空間，單位為像素。?『只適用于IE』 * topmargin=2? 設定整份文件顯示畫面的上方邊沿空間。?『只適用于IE』 * bgproperties="fixed"? 固定背景墻紙，當卷動文字時墻紙不會跟著卷動。?『只適用于IE』標記及參數之字母大小都可以。 ? ## 3、編寫規范 a、寫法 ·??????? 任何標記皆由""及">"所圍住，如?p> ·??????? 標記名與小于號之間不能留有空白字符。 ·??????? 某些標記　要加上參數，某些則不必。如 size="+2">Hello ·??????? 參數只可加于起始標記中。 ·??????? 在起始標記之標記名前加上符號"/"便是其終結標記，如 /font> ·??????? 標記字母大小寫皆可。建議全部小寫 b、HTML標記的分類 b.1圍堵標記：aaaa b.1空白標記：aaaa ## 4、常用的HTML標記 ### 排版標記：　 <?!--注解--?>；<?!--由這處開始是產品訂購表格--?> <?P?> ；段落標記：<?p align="center"?> <?BR?> ；換行 <?HR?> ；水平線 <?HR align="LEFT" size="2" width="70%" color="#0000FF" noshade?> <?CENTER?> ；居中標記 <?PRE?> ；預設格式標記 <?DIV?> ；區隔標記。作用：設定字、畫、表格等的擺放位置。 <?NOBR?> ；<?NOBR?>稱為不折行標記。作用：令某些文字不因太長而繞行，一　顯示于同一行或下一行。它對住址、數學算式、一行數字、程式碼等尤為有用。 <?WBR?> ； <?WBR?>稱為建議折行標記。作用：預設折行部位。 ### 字體標記：　 <?h1?>..<?h6?>h1最大字體 <?b?></b> <?storong?><?/storong?> :加粗 <?i?><?/i?> :斜體 <?em?><?/em?>:定義著重文字 <?u?><?/u?>:下劃線 <?s?><?/s?>:中劃線、刪除線 <?sup?>:上標 <?sub?>：下標 <?font?> ：字體大小 <?font face="Arial" size="+2" color="#008000">Creation of Webpage</font?> ### 圖像標記： <?img src="logo.gif" width=100 height=100 hspace=5 vspace=5 border=2 align="top" alt="Logo of PenPals Garden" lowsrc="pre_logo.gif"?> ### 清單標記： <?ol?> <?ul?> <?dl?><?li?><?dt?><?dd?> 無序清單：ul <?UL type="square"?> 有序清單：ol <?ol type="i" start="4"></ol?> 自定義清單：dl dt dd ### 表格標記： ~~~ <TABLE> <TR> <TD> ： ~~~ 這三個標記是定義表格的最重要的標記，可以說只學這三個己足夠。 <?TABLE?>是一個容器標記，意思是說它用以聲明這是表格而且其他表格標記只能在他的范圍內才適用，屬容器標記的還有其他。 <?TR?>用以標示表格列（?row?） <?TD?>用以標示儲存格（?cell?） <TABLE> 的參數設定（常用）：例如： <?table width="400" border="1" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="myweb.gif" bgcolor="#0000FF" bordercolor="#FF00FF" bordercolorlight="#00FF00" bordercolordark="#00FFFF" cols="2"?> width="400" 表格寬度，接受絕對值（如 80）及相對值（如 80%）。 border="1" 表格邊框厚度，不同瀏覽器有不同的內定值，故請指明。 cellspacing="2" 表格格線厚度，請看例子三，那是加厚到 5 的格線。 cellpadding="2" 文字與格線的距離，請看例子四，那是加至 10 的 padding。 align="CENTER" 表格的擺放位置（水平），可選值為： left, right, center，請看例子五或六，那表格是放于中間的，為怕一些瀏覽器不支援，故特加上居中標記<CENTER>，只是多層保證而己，當然只用<CENTER>亦可。 valign="TOP". 表格內字畫等的擺放貼　位置（垂直），可選值為： top, middle, bottom。 background="myweb.gif" 表格　紙，與 bgcolor 不要同用。 bgcolor="#0000FF" 表格底色，與 background 不要同用，請看例子六。 bordercolor="#FF00FF" 表格邊框顏色，NC 與 IE 有不同的效果，請看例子六。 bordercolorlight="#00FF00" 表格邊框向光部分的顏色，請看例子二。『只適用于 IE』 bordercolordark="#00FFFF" 表格邊框背光部分的顏色，請看例子二，使用 bordercolorlight 或 bordercolordark 時 bordercolor 將會失效。『只適用于 IE』 cols="2" 表格欄位數目，只是讓瀏覽器在下載表格是先畫出整個表格而己。 <?TR?> 的參數設定（常用）：例如：<tr align="RIGHT" valign="MIDDLE" bgcolor="#0000FF" bordercolor="#FF00FF" bordercolorlight="#808080" bordercolordark="#FF0000"> align="RIGHT" 該一列內字畫等的擺放貼　位置（水平），可選值為： left, center, right。 valign="MIDDLE" 該一列內字畫等的擺放貼　位置（垂直），可選值為： top, middle, bottom。 bgcolor="#0000FF" 該一列底色，請看例子五。 bordercolor="#FF00FF" 該一列邊框顏色，請看例子三。『只適用于 IE』 bordercolorlight="#808080" 該一列邊框向光部分的顏色，請看例子三。『只適用于 IE』 bordercolordark="#FF0000" 該一列邊框背光部分的顏色，請看例子三，使用 bordercolorlight 或 bordercolordark 時 bordercolor 將會失效。『只適用于 IE』 <TD> 的參數設定（常用）：例如：<td width="48%" height="400" colspan="5" rowspan="4" align="RIGHT" valign="BOTTOM" bgcolor="#FF00FF" bordercolor="#808080" bordercolorlight="#FF0000" bordercolordark="#00FF00" background="myweb.gif"> width="48%" 該一儲存格寬度，接受絕對值（如 80）及相對值（如 80%）。 height="400" 該一儲存格高度。 colspan="5" 該一儲存格向右打通的欄數。請看例子六 rowspan="4" 該一儲存格向下打通的列數。請看例子六 align="RIGHT" 該一儲存格內字畫等的擺放貼　位置（水平），可選值為： left, center, right。 valign="BOTTOM" 該一儲存格內字畫等的擺放貼　位置（垂直），可選值為： top, middle, bottom。 bgcolor="#FF00FF" 該一儲存格底色，請看例子四。 bordercolor="#808080" 該一儲存格邊框顏色，請看例子三。『只適用于 IE』 bordercolorlight="#FF0000" 該一儲存格邊框向光部分的顏色，請看例子三。『只適用于 IE』 bordercolordark="#00FF00" 該一儲存格邊框背光部分的顏色，請看例子三，使用 bordercolorlight 或 bordercolordark 時 bordercolor 將會失效。『只適用于 IE』 background="myweb.gif" 該一儲存格　紙，與 bgcolor 任用其一。