HTML-day-4-表單

標籤：

表單
使用<form>標籤定義一個表單，
格式為：<form id="" name="表單類型" method="表單的提交方式" action="提交的地址">
表單內容
</form>

一、屬性：
①id不可重複
②name可重複
③method，有兩種提交方式：get&post，get提交方式有長度限制，並且編碼後的內容在地址欄可見；post提交方式無長度限制，編碼後的內容在地址欄不可見。

二、表單元素
表單元素大致分為四種類型，文本類、按鈕類、選擇類和其他。
輸入框，可以使用input向表單中添加大部分元素，input標籤格式為：<input id=""type="類型" name="名稱" value="值"/>，
inputde的類型
1、文本類
①單行文字框，<input type="text" name="username" id="" value="需要顯示的文字"/>
②密碼框，<input type="password" name="password" id="" value="需要顯示的文字"/>
③文本域，<textarea name="" id="" cols=""（最大輸入字元多少） rows=""（最多輸入幾行）>
文本網域名稱
</textarea>
④隱藏欄位，<input type="hidden" name="" id="" value="需要顯示的文字"/>

2、按鈕類
①提交按鈕，<input type="submit" name="" id="" value="需要顯示的文字" disabled="disabled"/>
<input type="submit" name="" id="" value="需要顯示的文字" />

②重設按鈕，<input type="reset" name="" id="" value="需要顯示的文字" disabled="disabled"/>
<input type="reset" name="" id="" value="需要顯示的文字" >

③普通按鈕，<input type="button" name="" id="" value="需要顯示的文字" disabled="disabled"（停用）/>
<input type="button" name="" id="" value="需要顯示的文字" enabled="enabled"（可用的）/>

④圖片按鈕，<input type="image" src="圖片地址" name="" id="" disabled="disabled"（停用）/>
<input type="image" src="圖片地址" name="" id="" enabled="enabled"（可用的）/>

3、選擇類
①選項按鈕組，<input type="radio" name="" value="需要顯示的文字" />文本名稱
<input type="radio" name="" value="需要顯示的文字" checked="checked"/>文本名稱
註：這裡的value值是看不到的，是提交給程式用的，顯示的名稱須寫在標籤外面；
這裡的name值是用來分組的，只有組名稱相同時才可以單選，checked是預設選中

②複選框組，<input type="checkbox" name="" value="需要顯示的文字" />文本名稱
<input type="checkbox" name="" value="需要顯示的文字" checked="checked"/>文本名稱
註：這裡的value值是看不到的，是提交給程式用的，顯示的名稱須寫在標籤外面；checked="checked"設為預設選中。

③下拉式清單，<select name="" id="" size="1"（菜單） >
<select name="" id="" size="2" mutiple="mutiple">
<option value="" select="select">內容1</option>
<option value="">內容2</option>
<option value="">內容3</option>
</select>
註：當mutiple="mutiple"時，下拉式清單會出現雙箭頭，而不會顯示下拉式清單的全部內容；
當size="1"，為菜單，下拉式清單顯示一行；
當size=">=2"時，為列表，可顯示兩行或兩行以上；
select="select"設為預設
④檔案上傳，<input type="file" name="" id="" />
<lable for="">
</lable>
註：<lable>標籤為input元素定義圖說文字（標記）。lable元素不會向使用者呈現任何特殊效果。不過它為滑鼠使用者改進了可用性。
如果您在lable元素內點擊文本，就會觸發此控制項。就是說，當使用者選擇該標籤時，瀏覽器就會自動將焦點轉到和標籤相
關胡表單控制項上。
<lable>標籤的for屬性應當與相關元素胡id屬性相同。

HTML-day-4-表單