2.28 表單
提供許多欄位，讓使用者填入後，送出資料。
基本結構
<form action="#" method="#">
...
</form>action：值是一個網址，代表要將使用者填入的資料，送至此網址。
method：送資料至 action 所指定的網址，傳送的方式基本上有 get 或 post 兩種方式。若是 get 的話，表示資料會呈現於網址當中，post 則不會出現在網址當中，相對較安全。
如果表單有要傳送檔案，需增加 enctype 屬性及其值：
<form action="#" method="#" enctype="multipart/form-data">
...
</form>註：以上的屬性，會跟後端程式比較有關，目前可先初步認識即可。
表單相關欄位
文字框：一般文字
input 標籤不需要結束標籤。
另可以使用 <label for="指定id"></label> 標籤，對應到欄位的 id進行點擊的優化：
文字框：密碼
文字框：隱藏
實際上還是存在，只是使用者看不到，而且該元素也不會佔位。
多行文字框
單選
基本結構，通常會搭配 <label></label> 標籤一起使用。checked 是表示預設要選取。例：
多個選項時，若要創造單選的介面，則 name 要設定成一樣，才會被視為單選．例：
註：若有加上 <label>...</label> 標籤，有助於使用者的操作方便。
方式一：for 的值，對應到 id 的值。
方式二：<input> 放在 <label>…</label> 裡面。
範例：
勾選(核取方塊)
基本結構，通常會搭配 <label></label> 標籤一起使用。checked 是表示預設要選取。例：
註：同 單選(radio)相同，若有加上 <label>...</label> 標籤，有助於使用者的操作方便。
方式一：for 的值，對應到 id 的值。
方式二：<input> 放在 <label>…</label> 裡面。
範例：
下拉選單
基本選單：
selected：表示預設為這項。
分群選單，使用 <optgroup>...</optgroup> 包起來：
在 <select> 標籤上使用 multiple 屬性可以變成多選
一般按鈕
使用 button 標籤，type 屬性設定為 "button"，例：
這種按鈕使用者按了並不會有任何動作，需要再撰寫 JS 去開發相關需求。
資料送出按鈕
type 設定為 "submit"：
例：
使用者將這個按鈕按下去之後，會將所在的 form 表單裡的所有欄位資料，送到 form 標籤的 action 網址。
reset 按鈕
button 標籤，type 設定為 reset：
使用者將這個 reset 按鈕按下去之後，會將所在的 form 表單裡的所有欄位資料，都清空回到預設。
file 傳遞檔案
form 標籤的 method 屬性一定要用 post 方式。
form 標籤，記得加上
enctype="multipart/form-data"屬性。
單選語法：
多選語法：
範例：
Last updated