HTML基礎 表單 知識匯總

標籤：

 

表單：

<form id="" name="" method="post/get" action="負責處理的服務端">

id不可重複，name可重複，get提交有長度限制，並且編碼後的內容在地址欄可見，

post提交沒有長度限制，且編碼後內容不可見。

</form>

1.文本輸入

　　文字框<input type="txt" name="" id="" value="" />

　　密碼框<input type="password" name="" id="" value="" />

　　文本域<textarea name="" id="" cols=""(字元多少) rows=""(幾行高)></textarea>

　　隱藏欄位<input type="hidden" name="" id="" value="" />

2.按鈕

　　提交按鈕<input type="submit" name="" id="" disabled="disabled" value="" />點擊後轉到form內的提交伺服器的地址

　　重設按鈕<input type="reset" name="" id="" disabled="disabled" value="" />

　　普通按鈕<input type="button" name="" id="" disabled="disabled" value="" />

　　圖片按鈕<input type="image" name="" id="" disabled="disabled" src="圖片地址" />

　　disabled使按鈕失效

　　enable使按鈕可用

3.選擇輸入

　　選項按鈕組<input type="radio" name="" checked="checked" value="" />

　　name的值用來分組，value的值看不見，提交給程式用的，checked設定預設選項。

　　複選框組<input type="checkbox" name="" checked="checked" value="" />

　　檔案上傳<input type="file" name="" id="" />

　　<lable for=""></lable>

　　lable標籤為input元素定義圖說文字。

　　lable元素不會向使用者呈現任何特殊效果，不過，他為滑鼠使用者改進了可用性。如果您在lable元素內點擊文本，就會觸發此控制項。

　　就是說，當使用者選擇該標籤時，瀏覽器會 將焦點轉到和標籤相關的表單控制項上。

　　lable標籤的for屬性應當與相關元素的id屬性相同。

4.下拉式清單方塊

　　<select name="" id="" size="" multiple="multiple">

　　--size為1時，為菜單；>1時，為列表。multiple為多選。

　　　　<option value="值">內容1</option>

　　　　<option value="值" selected="selected">內容2</option>

　　　　--selected,設為預設

　　　　<option value="值">內容3</option>

　　</select>

5.標籤

         <label></label>

欄位集 （一堆label）

                  <fieldset></fieldset>

 

快速製作網頁的方法：

　　利用Photoshop中的切片工具來規划出要設定連結的位置，設定好後儲存為web可使用的html格式。

用DREAMWEAVER開啟，開啟設計頁面，選擇切片弄好的位置，在屬性中輸入超連結的網址即可。

 

HTML基礎 表單 知識匯總