HTML表單用于收集不同型別的用戶輸入，表單是一個包含表單元素的區域，表單元素是允許用戶在表單中輸入內容，比如：文本域(textarea)、下拉串列、單選框(radio-buttons)、復選框(checkboxes)等等，表單使用表單標簽<form>來設定
1 <form> 2 input elements 3 </form>
HTML 表單 - 輸入元素
多數情況下被用到的表單標簽是輸入標簽（<input>），<input>元素是最重要的表單元素，輸入型別是由型別屬性（type）定義的，大多數經常被用到的輸入型別如下：
- 文本域（Text Fields）
- 密碼欄位
- 單選按鈕（Radio Buttons）
- 復選框（Checkboxes）
- 提交按鈕(Submit Button)
一、什么是文本域（Text Fields）？
文本域通過<input type="text" /> 標簽來設定，當用戶要在表單中鍵入字母、數字等內容時，就會用到文本域，注意:表單本身并不可見，同時，在大多數瀏覽器中，文本域的預設寬度是20個字符，
二、什么是密碼欄位？
密碼欄位通過標簽<input type="password" /> 來定義，注意:密碼欄位字符不會明文顯示，而是以星號或圓點替代，
1 <form> 2 Password: <input type="password" name="pwd"> 3 </form>
三、什么是單選按鈕（Radio Buttons）？
<input type="radio">標簽定義了表單單選框選項
1 <form> 2 <input type="radio" name="sex" value="male">Male<br> 3 <input type="radio" name="sex" value="female">Female 4 </form>
四、什么是復選框（Checkboxes）？
<input type="checkbox"> 定義了復選框. 用戶需要從若干給定的選擇中選取一個或若干選項，
1 <form> 2 <input type="checkbox" name="vehicle" value="Bike">I have a bike<br> 3 <input type="checkbox" name="vehicle" value="Car">I have a car 4 </form>
五、什么是提交按鈕(Submit Button)？
<input type="submit">>定義了提交按鈕.當用戶單擊確認按鈕時，表單的內容會被傳送到另一個檔案，表單的動作屬性定義了目的檔案的檔案名，由動作屬性定義的這個檔案通常會對接收到的輸入資料進行相關的處理
注釋:假如您在文本框內鍵入幾個字母，然后點擊確認按鈕，那么輸入資料會傳送到 "html_form_action.php" 的頁面，該頁面將顯示出輸入的結果，
1 <form name="input" action="html_form_action.php" method="get"> 2 Username: <input type="text" name="user"> 3 <input type="submit" value="Submit"> 4 </form>
關于html表單補充部分
- A.html基本標簽表單實作互動原理，單選框，復選框，下拉框介紹
- 概括：表單是什么？表單是前端和服務器做互動的一種機制，表單收集用戶輸入資訊，之后發送或者提交給服務器，用戶在輸入的資訊稱之為內容，內容的文本分為普通和密碼型，用戶通過單選框、復選框、下拉框（也就是下拉選單）完成內容資訊輸入，最后通過提交按鈕發送給服務器！這里要講到瀏覽器怎么發送給服務器？涉及到http協議，也就是超文本傳輸協議，它是瀏覽器和服務器通訊的一種機制，模式為：請求——應答，瀏覽器發送請求=>服務器接收=>自身處理=>結果回傳瀏覽器=>瀏覽器根據結果展示頁面給用戶，請求分為GET和POST；以及input單選框，復選框和select下拉框介紹
- B.form實作瀏覽者登陸、注冊頁面與瀏覽器的互動
- 概括：網站怎樣與用戶進行互動？答案是使用HTML表單(form)，表單是可以把瀏覽者輸入的資料傳送到服務器端，這樣服務器端程式就可以處理表單傳過來的資料， <:form method="傳送方式" action="服務器檔案">1.<form>標簽是成對出現的2.action ：瀏覽者輸入的資料被傳送到的地方,比如一個PHP頁面(save.php);3.method ： 資料傳送的方式（get/post），注意事項:1>所有表單控制元件（文本框、文本域、按鈕、單選框、復選框等）都必須放在 <form<>/form> 標簽之間（否則用戶輸入的資訊可提交不到服務器上哦！）2>method : post/get 的區別這一部分內容屬于后端程式員考慮的問題，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/55498.html
標籤：Html/Css