【018】
input 元素：type 屬性 可以有 22 個不同的值：text、password、button、submit、reset、radio、checkbox、time、date、month、week、datetime-local、email、tel、search、url、color、file、image、number、range、hidden
1.按鈕 submit、button 和 reset
<form>
<input type="button" value="點我">
</form>
2.單選框 radio
<form>
<input type="radio" name="gender" value="女"> 女<br>
<input type="radio" name="gender" value="男"> 男<br>
</form>
3.復選框 checkbox
<form>
<input type="checkbox" name="fruit" value="watermelon">西瓜<br>
<input type="checkbox" name="fruit" value="banana">香蕉<br>
<input type="checkbox" name="fruit" value="blueberry">藍莓<br>
</form>
4.時間和日期
time：獲取時間
date：獲取日期
month：獲取年月
week：獲取星期
datetime-local：獲取本地日期和時間
【019】
1. 搜索框：search
<form>
度娘: <input type="search" name="bdSearch">
</form>
2.顏色選擇框：color
<form>
選擇魚油最喜歡的顏色: <input type="color" name="favcolor"><br>
</form>
3.圖像按鈕：image
將 input 元素的 type 屬性設置為 "image"，就可以使用圖像來表示按鈕
<form>
<input type="image" src="images/FishC.png" alt="Submit" width="64" height="64">
</form>
4.將 input 元素隱藏起來：hidden
【020】
1.上傳文件：file
<form>
選擇一個文件: <input type="file" name="filedata">
</form>
要成功向服務器上傳文件，除了必須將提交表單的方法設置為 post 之外，還需要指定表單的 enctype 屬性。enctype 屬性規定了在發送到服務器之前，應該如何對表單的數據進行編碼，只有正確編碼的數據，才能完整地傳遞給服務器。
默認情況下，enctype 屬性被設置為 "application/x-www-form-urlencoded"，它會對所有的字符進行編碼，並不適用於文件傳輸。文件傳輸需要將該屬性設置為 "multipart/form-data"。
2.限定上傳文件的類型： accept
不對文件上傳作限制，可能會給服務器帶來災難性的后果。
input 元素有一個 accept 屬性，表示可以選擇的文件類型，多個類型之間使用英文的逗號隔開。
除此之外，你還可以使用 MIME 類型來描述，這里有一個完整的 MIME 類型列表 -> 傳送門 注意：accept 屬性只是起到 “建議” 的作用，並不能強制限制用戶的文件上傳類型。限制文件類型還是需要使用 JavaScript 或通過后端的 PHP 來實現。
3. 限定上傳文件的尺寸
在上傳文件這個 input 元素前面，追加一個 name 為 MAX_FILE_SIZE 的隱藏字段，value 指定允許上傳的文件尺寸，單位是字節。
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="1024">
<label>請選擇您要上傳的文件：<input type="file" name="file" accept="image/*"></label>
<br><br>
<input type="submit" value="提交">
</form>
</body>
4.上傳多個文件 multiple
只需要在 input 元素里面添加一個 multiple 屬性即可。
【021】
1.限定數字輸入：number
輸入框可以限定用戶只能輸入數字
<form> 數量 (1-99之間):
<input type="number" name="quantity" min="1" max="99">
</form>
2.限定數字輸入范圍：min、max 和 step
我們還可以限制數字的范圍。有三個額外的屬性可以跟 number 搭配來使用：min、max 和 step。顧名思義，min 指定的是可接受最小的值，max 指定的是可接受最大的值，step 則是指定每次調整的幅度。
3.數值滾動條：range
<form> 范圍(1-11):
<input type="range" name="points" min="1" max="11">
</form>
4.郵箱、電話和網址：email、tel 和 url
<form> E-mail:
<input type="email" name="usremail">
</form>
5.pattern 屬性
HTML5 新增了一個 pattern 屬性，允許我們自己來指定這個匹配模式。要寫這個 pattern 屬性，需寫正則表達式。