HTML《隨手查》方便張貼論壇！

adm

HTML《隨手查》方便張貼論壇！

Subject:

[quote=yawnp0426]說明：在 gcin 論壇，常常需要用 HTML 格式編寫文章內容，在此張貼指令手冊，方便撰寫查閱！ 練習：【巭孬嫑䳗】【𫘄𫑑𫗻𫙌】【𪯡𠁀𪚢𩫍】 ==============================================================================
Ⅰ、基礎篇
概念： &lt;html&gt; &lt;head&gt; 文件檔頭 &lt;title&gt;文件標題&lt;/title&gt; &lt;meta http-equiv=....&gt;文件資訊 &lt;script language="語法宣告"&gt;......&lt;/script&gt; &lt;/head&gt; &lt;body&gt; 文件主體 &lt;/body&gt; &lt;/html&gt;
①&lt;html&gt;：HTML文件宣告 語法： &lt;html&gt;文件內容&lt;/html&gt;
②&lt;html dir&gt;：HTML文件方向 語法： &lt;html dir="ltr/rtl"&gt;
③&lt;head&gt;：文件檔頭 語法： &lt;head&gt;文件檔頭&lt;/head&gt;
④&lt;meta&gt;：文件資訊 語法：自動更新網頁 &lt;meta http-equiv="refresh" content="秒數;url=連結網址"&gt; 語法：文字編碼方式 &lt;meta http-equiv="content-type" content="text/html;charset=編碼方式"&gt; 如：Big5, utf-8
⑤&lt;title&gt;：文件標題 語法： &lt;title&gt;文件標題&lt;/title&gt;
⑥&lt;body&gt;：文件主體 語法： &lt;body&gt;文件主體&lt;/body&gt; 語法：文字顏色 &lt;body text="顏色屬性"&gt;......&lt;/body&gt; 如：red, 00FFFF 語法：網頁左邊界 &lt;body leftmargin="數字"&gt;......&lt;/body&gt; 語法：網頁上邊界 &lt;body topmargin="數字"&gt;......&lt;/body&gt; 語法：背景顏色 &lt;body bgcolor="顏色屬性"&gt;......&lt;/body&gt; 如：red, 00FFFF 語法：背景圖片 &lt;body background="圖片路徑"&gt;......&lt;/body&gt; 語法：固定背景圖片〔只適用IE〕 &lt;body bgproperties="fixed"&gt;......&lt;/body&gt; 語法：超連結顏色 &lt;body link="顏色屬性"&gt;......&lt;/body&gt; 尚未讀取 如：blue, green, pink &lt;body vlink="顏色屬性"&gt;......&lt;/body&gt; 已經讀取 如：blue, green, pink &lt;body alink="顏色屬性"&gt;......&lt;/body&gt; 按下滑鼠，正要讀取 如：blue, green, pink
⑦&lt;script&gt;：程式碼宣告 語法： &lt;script language="語法宣告"&gt;......&lt;/script&gt; 如：language="JavaScript"
⑧&lt;!--&gt;：文件附註 語法： &lt;!--附註文字--&gt;
 Ⅱ、文字篇
①&lt;h1&gt;~&lt;h6&gt;：標題字 語法： &lt;h1&gt;文字&lt;/h1&gt; &lt;h2&gt;文字&lt;/h2&gt; &lt;h3&gt;文字&lt;/h3&gt; &lt;h4&gt;文字&lt;/h4&gt; &lt;h5&gt;文字&lt;/h5&gt; &lt;h6&gt;文字&lt;/h6&gt; 語法：標題字對齊 &lt;h1 align="位置"&gt;文字&lt;/h1&gt; 如：align="center" ; align="right"
②&lt;b&gt;：粗體字 語法： &lt;b&gt;文字&lt;/b&gt;
③&lt;strong&gt;：粗體字 語法： &lt;strong&gt;文字&lt;/strong&gt;
④&lt;i&gt;：斜體字 語法： &lt;i&gt;文字&lt;/i&gt;
⑤&lt;em&gt;：斜體字 語法： &lt;em&gt;文字&lt;/em&gt;
⑥&lt;var&gt;：斜體字 語法： &lt;var&gt;文字&lt;/var&gt;
⑦&lt;cite&gt;：斜體字 語法： &lt;cite&gt;文字&lt;/cite&gt;
⑧&lt;u&gt;：底線字 語法： &lt;u&gt;文字&lt;/u&gt;
⑨&lt;s&gt;：刪除線字 語法： &lt;s&gt;文字&lt;/s&gt;
⑩&lt;strike&gt;：刪除線字 語法： &lt;strike&gt;文字&lt;/strike&gt;
⑪&lt;tt&gt;：電報字體 語法： &lt;tt&gt;文字&lt;/tt&gt;
⑫&lt;big&gt;：加大字體 語法： &lt;big&gt;文字&lt;/big&gt;
⑬&lt;small&gt;：縮小字體 語法： &lt;small&gt;文字&lt;/small&gt;
⑭&lt;sup&gt;：上標字 語法： &lt;sup&gt;文字&lt;/sup&gt;
⑮&lt;sub&gt;：下標字 語法： &lt;sub&gt;文字&lt;/sub&gt;
⑯&lt;code&gt;：程式碼字體 語法： &lt;code&gt;文字&lt;/code&gt;
⑰&lt;dfn&gt;：定義文字體 語法： &lt;dfn&gt;文字&lt;/dfn&gt;
⑱&lt;kbd&gt;：輸入文字體 語法： &lt;kbd&gt;文字&lt;/kbd&gt;
⑲&lt;samp&gt;：輸出文字體 語法： &lt;samp&gt;文字&lt;/samp&gt;
⑳&lt;basefont&gt;：基本字型 語法： &lt;basefont size="級數"&gt;文字&lt;/basefont&gt;
㉑&lt;font&gt;：字型設定 語法：字型大小 &lt;font size="級數"&gt;文字&lt;/font&gt; 語法：字型名稱 &lt;font face="字體名稱"&gt;文字&lt;/font&gt; 如：華康雅宋體 語法：字型顏色 &lt;font color="顏色屬性"&gt;文字&lt;/font&gt;
㉑&lt;blink&gt;：閃爍字〔只適用Netscape〕 語法： &lt;blink&gt;文字&lt;/blink&gt;
㉒&lt;&gt;"&amp;&plusmn;&trade;&copy;&reg;&yen;&pound;：特殊字元 語法： &lt; &amp;lt; &gt; &amp;gt; " &amp;quot; &amp; &amp;amp; &plusmn; &amp;plusmn; &trade; &amp;trade; &copy; &amp;copy; &reg; &amp;reg; &yen; &amp;yen; &pound; &amp;pound;
 Ⅲ、段落篇
①&lt;br&gt;：段落換行 語法： 文字&lt;br&gt;
②&lt;p&gt;：新增段落 語法： 文字&lt;p&gt;
③&lt;nobr&gt;：取消自動換行 語法： &lt;nobr&gt;文字&lt;/nobr&gt;
④&lt;pre&gt;：保留格式 語法： &lt;pre&gt;文字&lt;/pre&gt;
⑤&lt;blockquote&gt;：段落縮排 語法： &lt;blockquote&gt;文字&lt;/blockquote&gt;
⑥&lt;address&gt;：地址格式 語法： &lt;address&gt;文字&lt;/address&gt;
⑦&lt;center&gt;：居中對齊 語法： &lt;center&gt;文字&lt;/center&gt;
⑧&lt;xmp&gt;：保留輸出 語法： &lt;xmp&gt;文字&lt;/xmp&gt;
⑨&lt;hr&gt;：水平線 語法： &lt;hr&gt; 語法：水平線粗細 &lt;hr size="數字"&gt; 語法：水平線長度 &lt;hr width="數字／百分比"&gt; 語法：水平線顏色 &lt;hr color="顏色屬性"&gt; 語法：水平線位置 &lt;hr align="left/center/right"&gt; 語法：水平線陰影 &lt;hr noshade&gt;
 Ⅳ、影像篇
①&lt;img&gt;：加入圖片 語法：圖片路徑 &lt;img src="圖片路徑"&gt; 如：flower.jpg 語法：圖片說明 &lt;img alt="說明文字"&gt; 語法：調整圖片大小 &lt;img width="數字" height="數字"&gt; 語法：圖片外框 &lt;img border="數字"&gt; 語法：文字對齊圖片上方 &lt;img align="top"&gt; 語法：文字對齊圖片中央 &lt;img align="middle"&gt; 語法：文字對齊圖片下方 &lt;img align="bottom"&gt; 語法：圖片靠左 &lt;img align="left"&gt; 語法：圖片靠右 &lt;img align="right"&gt; 語法：圖片垂直距離 &lt;img vspace="數字"&gt; 語法：圖片水平距離 &lt;img hspace="數字"&gt; 語法：低解析圖片 &lt;img lowsrc="圖片路徑"&gt; 語法：播放影片 &lt;img dynsrc="影片路徑"&gt; 如：move.avi 影片屬性： start="fileopen" 或是"mouseover" loop="播放次數" loopdelay="間隔時間" height="高度" width="寬度"
②&lt;marquee&gt;：跑馬燈 語法：加入跑馬燈 &lt;marquee&gt;文字&lt;/marquee&gt; 屬性：align="top" ; align="middle" ; align="bottom" 語法：跑馬燈移動方式 &lt;marquee behavior="scroll"&gt;文字&lt;/marquee&gt; &lt;marquee behavior="alternate"&gt;文字&lt;/marquee&gt; &lt;marquee behavior="slide"&gt;文字&lt;/marquee&gt; 語法：跑馬燈底色 &lt;marquee bgcolor="顏色屬性"&gt;文字&lt;/marquee&gt; 語法：跑馬燈方向 &lt;marquee direction="left/right"&gt;文字&lt;/marquee&gt; 語法：跑馬燈重複次數 &lt;marquee loop="數字"&gt;文字&lt;/marquee&gt; 語法：跑馬燈延遲時間 &lt;marquee scrolldelay="數字"&gt;文字&lt;/marquee&gt; 語法：跑馬燈移動距離 &lt;marquee scrollamount="數字"&gt;文字&lt;/marquee&gt; 語法：跑馬燈高度 &lt;marquee height="數字"&gt;文字&lt;/marquee&gt; 語法：跑馬燈寬度 &lt;marquee width="數字"&gt;文字&lt;/marquee&gt; 語法：跑馬燈上下留白空間 &lt;marquee vspace="數字"&gt;文字&lt;/marquee&gt; 語法：跑馬燈左右留白空間 &lt;marquee hspace="數字"&gt;文字&lt;/marquee&gt;
③&lt;bgsound&gt;：背景音樂 語法：播放背景音樂 &lt;bgsound src="音樂檔案路徑"&gt; 如：moon.wav ; moon.au ; moon.mid 語法：背景音樂播放次數 &lt;bgsound loop="次數"&gt;
④&lt;embed&gt;：嵌入物件 語法： &lt;embed src="檔案路徑" width="數值" height="數值" autostart="true" loop="true"&gt; 如：movie.avi
 Ⅴ、連結篇
①&lt;a&gt;：超連結 語法：連結http網頁 &lt;a href="http網址"&gt;文字&lt;/a&gt; 語法：連結文字說明 &lt;a title="文字說明"&gt;文字&lt;/a&gt; 語法：連結檔案 &lt;a href="file路徑"&gt;文字&lt;/a&gt; 如：file:///home/yawnp0426/sun%20day/moon.wav 語法：連結FTP網站 &lt;a href="ftp路徑"&gt;文字&lt;/a&gt; 如：ftp://使用者名稱:使用者密碼@主機名稱:port/路徑/檔名 語法：開啟電子信箱 &lt;a href="mailto:電子信箱地址"&gt;文字&lt;/a&gt; 語法：進入新聞討論區 &lt;a href="news:討論區路徑"&gt;文字&lt;/a&gt; 語法：連結文件段落 &lt;a href="#位置名稱"&gt;文字&lt;/a&gt; &lt;a name="段落名稱"&gt;文字&lt;/a&gt; 語法：連結文件位置 &lt;a href="檔案名稱#位置名稱"&gt;文字&lt;/a&gt; 語法：圖片超連結 &lt;a href="檔案名稱#位置名稱"&gt;&lt;img src="圖片路徑"&gt;&lt;/a&gt;
②&lt;base&gt;：基本路徑 語法： &lt;base href="基本路徑"&gt; 如：絕對路徑=基本路徑+相對路徑；相對路徑可加「../」符號
③&lt;area&gt;：影像連結區域 語法： &lt;map name="地圖名稱"&gt;&lt;area shape="形狀" coords="座標" href="檔案路徑"&gt;&lt;/map&gt; 語法：標籤內的「shape形狀」 &lt;area shape="circle" coords="x1,y1,r"&gt; 如：圓形 &lt;area shape="rect" coords="x1,y1,x2,y2"&gt; 如：矩形 &lt;area shape="poly" coords="x1,y1,x2,y2...xn,yn"&gt; 如：多邊形 語法：標籤內的連結說明屬性 &lt;area alt="說明文字"&gt;
④&lt;a&gt;：超連結屬性 語法：連結新視窗 &lt;a href="連結路徑" target="_blank"&gt;文字&lt;/a&gt; 語法：連結原本視窗 &lt;a href="連結路徑" target="_self"&gt;文字&lt;/a&gt; 語法：連結指定框架 &lt;a href="連結路徑" target="視窗名稱"&gt;連結字串&lt;/a&gt; 如：target="right" 語法：連結最大框架 &lt;a href="連結路徑" target="_top"&gt;連結字串&lt;/a&gt; 語法：在父框架中開啟 &lt;a href="連結路徑" target="_parent"&gt;連結字串&lt;/a&gt; 說明：「_top」和「_parent」的差別，就在分割左右多框視窗的左邊 是否會「_top」被取代。
 Ⅵ、清單篇
①&lt;menu&gt;：建立清單 語法： &lt;menu&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/menu&gt; 語法：樣式種類 &lt;menu type="disc"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/menu&gt; &lt;menu type="circle"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/menu&gt;〔只適用Netscape〕 &lt;menu type="square"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/menu&gt;〔只適用Netscape〕
②&lt;dir&gt;：建立清單 語法： &lt;dir&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/dir&gt;
③&lt;lh&gt;：建立清單 語法： &lt;lh&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/lh&gt;
④&lt;ul&gt;：無序號清單 語法： &lt;ul&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ul&gt;
⑤&lt;ol&gt;：序號清單 語法： &lt;ol&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt; 語法：序號清單樣式 &lt;ol type="1"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt; &lt;ol type="a"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt; &lt;ol type="A"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt; &lt;ol type="i"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt; &lt;ol type="I"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt; 語法：清單起始數字 &lt;ol start="數字"&gt;&lt;li&gt;清單內容&lt;/li&gt;&lt;/ol&gt;
⑥&lt;dl&gt;：定義清單 語法： &lt;dl&gt; &lt;dt&gt;清單項目&lt;/dt&gt; &lt;dd&gt;清單內容&lt;/dd&gt; &lt;/dl&gt;
⑦巢狀清單
語法：符號式巢狀清單 &lt;html&gt; &lt;head&gt; &lt;title&gt;Ex_06_09&lt;/title&gt; &lt;/head&gt; &lt;body&gt; 網頁設計課程種類： &lt;ul&gt; &lt;li&gt;應用軟體類&lt;/li&gt; &lt;ul&gt; &lt;li&gt;基礎篇&lt;/li&gt; &lt;li&gt;進階篇&lt;/li&gt; &lt;/ul&gt; &lt;li&gt;程式語言類&lt;/li&gt; &lt;ul&gt; &lt;li&gt;基礎篇&lt;/li&gt; &lt;li&gt;進階篇&lt;/li&gt; &lt;/ul&gt; &lt;/ul&gt; &lt;/body&gt; &lt;/html&gt;
語法：序號式巢狀清單 &lt;html&gt; &lt;head&gt; &lt;title&gt;Ex_06_10&lt;/title&gt; &lt;/head&gt; &lt;body&gt; 網頁設計課程種類： &lt;ol type="A"&gt; &lt;li&gt;應用軟體類&lt;/li&gt; &lt;ol type="1"&gt; &lt;li&gt;基礎篇&lt;/li&gt; &lt;li&gt;進階篇&lt;/li&gt; &lt;/ol&gt; &lt;li&gt;程式語言類&lt;/li&gt; &lt;ol type="1"&gt; &lt;li&gt;基礎篇&lt;/li&gt; &lt;li&gt;進階篇&lt;/li&gt; &lt;/ol&gt; &lt;/ol&gt; &lt;/body&gt; &lt;/html&gt;
語法：混合式巢狀清單 &lt;html&gt; &lt;head&gt; &lt;title&gt;Ex_06_11&lt;/title&gt; &lt;/head&gt; &lt;body&gt; 網頁設計課程種類： &lt;ol type="I"&gt; &lt;li&gt;應用軟體類&lt;/li&gt; &lt;ul&gt; &lt;li&gt;基礎篇&lt;/li&gt; &lt;ol&gt; &lt;li&gt;FrontPage&lt;/li&gt; &lt;li&gt;PhotoImpact&lt;/li&gt; &lt;/ol&gt; &lt;li&gt;進階篇&lt;/li&gt; &lt;ol&gt; &lt;li&gt;Flash&lt;/li&gt; &lt;li&gt;Dreamweaver&lt;/li&gt; &lt;/ol&gt; &lt;/ul&gt; &lt;li&gt;程式語言類&lt;/li&gt; &lt;ul&gt; &lt;li&gt;基礎篇&lt;/li&gt; &lt;ol&gt; &lt;li&gt;HTML&lt;/li&gt; &lt;/ol&gt; &lt;li&gt;進階篇&lt;/li&gt; &lt;ol&gt; &lt;li&gt;JavaScript&lt;/li&gt; &lt;li&gt;XML&lt;/li&gt; &lt;li&gt;ASP&lt;/li&gt; &lt;/ol&gt; &lt;/ul&gt; &lt;/ol&gt; &lt;/body&gt; &lt;/html&gt;
 Ⅶ、表格篇
①&lt;table&gt;：表格 語法：表格位置 &lt;table align="位置"&gt;表格內容&lt;/table&gt; 如：align="center" ; align="right" 語法：表格寬度 &lt;table width="數字"&gt;表格內容&lt;/table&gt; 語法：表格高度 &lt;table height="數字"&gt;表格內容&lt;/table&gt; 語法：表格背景顏色 &lt;table bgcolor="顏色屬性"&gt;表格內容&lt;/table&gt; 如：pink, aqua, red, blue 語法：表格邊框寬度 &lt;table border="數字"&gt;表格內容&lt;/table&gt; 語法：表格邊框顏色 &lt;table bordercolor="顏色屬性"&gt;表格內容&lt;/table&gt; 如：pink, aqua, red, blue 語法：表格邊框明暗 &lt;table bordercolorlight="顏色屬性"&gt;表格內容&lt;/table&gt; &lt;table bordercolordark="顏色屬性"&gt;表格內容&lt;/table&gt; 語法：表格框線寬度 &lt;table cellspacing="數字"&gt;表格內容&lt;/table&gt; 語法：表格框線距離 &lt;table cellpadding="數字"&gt;表格內容&lt;/table&gt; 語法：表格背景圖片 &lt;table background="圖片路徑"&gt;表格內容&lt;/table&gt;
②&lt;tr&gt;：表格列 語法：表格列背景顏色 &lt;tr bgcolor="顏色屬性"&gt;表格內容&lt;/tr&gt; 如：deeppink, pink 語法：表格列對齊方式 &lt;tr align="left/center/right"&gt;表格內容&lt;/tr&gt; 語法：表格列上下對齊 &lt;tr valign="top/middle/bottom"&gt;表格內容&lt;/tr&gt;
③&lt;th&gt;/&lt;td&gt;：表格標題和內容 語法： &lt;th&gt;表格標題&lt;/th&gt; &lt;td&gt;表格内容&lt;/td&gt; 語法：儲存格寬度 &lt;th width="數字"&gt;表格標題&lt;/th&gt; &lt;td width="數字"&gt;表格内容&lt;/td&gt; 語法：儲存格高度 &lt;th height="數字"&gt;表格標題&lt;/th&gt; &lt;td height="數字"&gt;表格内容&lt;/td&gt; 語法：儲存格左右對齊方式 &lt;th align="left/center/right"&gt;表格標題&lt;/th&gt; &lt;td align="left/center/right"&gt;表格内容&lt;/td&gt; 語法：儲存格上下對齊方式 &lt;th valign="top/middle/bottom"&gt;表格標題&lt;/th&gt; &lt;td valign="top/middle/bottom"&gt;表格内容&lt;/td&gt; 語法：儲存格背景顏色 &lt;th bgcolor="顏色屬性"&gt;表格標題&lt;/th&gt; &lt;td bgcolor="顏色屬性"&gt;表格内容&lt;/td&gt; 語法：儲存格背景圖片 &lt;th background="圖片路徑"&gt;表格標題&lt;/th&gt; &lt;td background="圖片路徑"&gt;表格内容&lt;/td&gt; 語法：儲存格跨欄設定 &lt;th colspan="數字"&gt;表格標題&lt;/th&gt; &lt;td colspan="數字"&gt;表格内容&lt;/td&gt; 語法：儲存格跨列設定 &lt;th rowspan="數字"&gt;表格標題&lt;/th&gt; &lt;td rowspan="數字"&gt;表格内容&lt;/td&gt;
④&lt;caption&gt;：表格標題 語法： &lt;caption&gt;表格標題&lt;/caption&gt; 語法：標題對齊方式 &lt;caption align="left/center/right"&gt;表格標題&lt;/caption&gt; 語法：標題位置 &lt;caption valign="top/bottom"&gt;表格標題&lt;/caption&gt;
⑤巢狀表格
語法： &lt;html&gt; &lt;head&gt; &lt;title&gt;Ex_07_25&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;center&gt; &lt;h3&gt;這是一個「巢狀表格」&lt;/h3&gt; &lt;table border="1" bgcolor="yellow" width="80%" height="50%"&gt; &lt;tr&gt; &lt;th&gt;外表格&lt;/th&gt;&lt;th&gt;外表格&lt;/th&gt;&lt;th&gt;外表格&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt;外表格&lt;/th&gt; &lt;th&gt; &lt;table border="1" bgcolor="beige" width="80%"&gt; &lt;tr&gt; &lt;th&gt;內表格&lt;/th&gt;&lt;th&gt;內表格&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt;內表格&lt;/th&gt;&lt;th&gt;內表格&lt;/th&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/th&gt; &lt;th&gt;外表格&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt;外表格&lt;/th&gt;&lt;th&gt;外表格&lt;/th&gt;&lt;th&gt;外表格&lt;/th&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/center&gt; &lt;body&gt; &lt;html&gt;
 Ⅷ、表單篇
①&lt;form&gt;：表單 語法： &lt;form action="資料傳送目的地" method="資料傳遞方式"&gt;表單內容與表單元素&lt;/form&gt; 如：method="get";method="post"
②&lt;input&gt;：文字欄位輸入 語法： &lt;form&gt; 名稱欄位：&lt;input type="text" name="名稱欄位" value="欄位值" style="欄位樣式"&gt; 密碼欄位：&lt;input type="password" name="密碼欄位" value="欄位值" style="欄位樣式"&gt; &lt;/form&gt; type="屬性"： button 定義可點擊按鈕（多數情況下，用於通過 JavaScript 啟動腳本）。 checkbox 定義復選框。 file 定義輸入字段和 "瀏覽"按鈕，供文件上傳。 hidden 定義隱藏的輸入字段。 image 定義圖像形式的提交按鈕。 password 定義密碼字段而該字段中的字符被掩碼。 radio 定義單選按鈕。 reset 定義重置按鈕。重置按鈕會清除表單中的所有數據。 submit 定義提交按鈕。提交按鈕會把表單數據發送到服務器。 text 定義單行的輸入字段，用戶可在其中輸入文本。默認寬度為 20 個字符。 ~~~~="屬性"：src,alt,checked,maxlength,size 必須把 src 屬性和 alt 屬性與 &lt;input type="image" src="submit.gif" alt="Submit"&gt; 結合使用。 必須把 checked 屬性與 &lt;input type="checkbox" checked="checked"&gt; 或 &lt;input type="radio" checked="checked"&gt; 配合使用。 必須把 maxlength 屬性與 &lt;input type="text"&gt; 或 &lt;input type="password"&gt; 配合使用。 對於 &lt;input type="text"&gt; 和 &lt;input type="password"&gt;，size 屬性定義的是可見的字符數。而對於其他類型，size 屬性定義的是以像素為單位的輸入字段寬度。 由於 size 屬性是一個可視化的設計屬性，推薦使用 CSS 來代替兼容它。 CSS 語法：&lt;input style="width:100px"&gt;
③表單製作： 語法： &lt;html&gt; &lt;body&gt; &lt;form action="mailto:test@cs.nthu.edu.tw" method="post"&gt; 名字：&lt;input name="myname" size=10 maxlength=20 value="蕭亞軒"&gt;&lt;P&gt; 密碼：&lt;input name="passwd" type=password size=8 maxlength=8&gt;&lt;P&gt; 性別：&lt;input name="sex" type=radio value="男"&gt;男 &lt;input name="sex" type=radio value="女" checked="checked"&gt;女&lt;P&gt; 嗜好（可複選）： &lt;input name="f1" type=checkbox value="book"&gt;閱讀 &lt;input name="f2" type=checkbox value="sport" checked="checked"&gt;運動 &lt;input name="f3" type=checkbox value="music" checked="checked"&gt;音樂 &lt;input name="f4" type=checkbox value="sleep"&gt;睡覺 &lt;input name="f4" type=checkbox value="talk"&gt;聊天&lt;P&gt; &lt;input type="submit" value="送出表單"&gt; &lt;input type="reset" value="重新輸入"&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt;
 附註：<a href="http://bluegriffon.org/#download" target="_blank">【下載 BlueGriffon 免費網頁編輯軟體】</a>[/quote]

Use Shift-Enter(new line) to replace Enter(new paragraph) if necessary

Input characters on the left

Member login: E-mail or dispid password