星期一, 7月 20, 2026

HTML Input 元件 2

 ※ 來源:Bing (少一個圖片上傳)

在 HTML 中,<input> 元素的 type 屬性決定了輸入欄位的類型與行為。
HTML5 之後,type 的種類大幅增加,目前常見的類型如下(共 20+ 種):

文字與數據類

類型說明
text單行文字輸入(預設值)
password密碼輸入(隱藏字元)
email電子郵件格式驗證
url網址格式驗證
tel電話號碼(不會自動驗證格式)
search搜尋框(部分瀏覽器會加上清除按鈕)
number數字輸入(可設定 minmaxstep

日期與時間類

類型說明
date年-月-日
time時:分(可含秒)
datetime-local本地日期與時間
month年-月
week年-週

選擇與控制類

類型說明
checkbox多選框
radio單選框
range範圍滑桿(數值)
color顏色選擇器
file檔案上傳
hidden隱藏欄位(不顯示在頁面上)

按鈕類

類型說明
button一般按鈕(需搭配 JS)
submit提交表單
reset重設表單


 總結
HTML5 規範中,<input>  type 屬性共有 23 種主要類型(部分瀏覽器可能不完全支援,例如 datetime 已被棄用)。


---------------------------------------------------------------------
範例截圖: