今天要來介紹input，也可以整理一下關於input的屬性
input的標籤屬性

• input name=""
  用來指定送出去的該筆資料的名稱，讓遠端伺服器能透過明確定義好的名稱，取出對應的欄位值。
• input value=""
  指定初始值
• input disabled
  將元件設定為禁用狀態
• input readonly
  將元件設為唯獨不可更改內容的狀態
• input autocomplete=""
  是否啟用瀏覽器自動完成功能，值有on和off，預設是on。
• input autofocus
  當頁面載入後，自動聚焦在此欄位上，但要注意，整個頁面所有的表單元件中只能有一個 autofocus 而已。
• input required
  指定為必填欄位，如果為required的欄位內容沒有填寫，會被瀏覽器提醒必填。
• input placeholder=""
  輸入的提示訊息

input的type屬性

• input type="text" 文字輸入欄位
  input的type 預設上就是text，所以也可以省略不寫，沒type時其實就是text。

• input type="password" 密碼輸入欄位
  密碼文字輸入欄位和 text 的差別是，使用者輸入的內容不會被明碼顯示在螢幕畫面中。

• input type="checkbox" 核取方塊
  用來讓使用者勾選某個選項是否成立，可以再搭配value屬性(預設值是"on") 來指定當使用者勾選此方塊時要傳送給遠端伺服器什麼值。
• input type="radio" 選項按鈕
  用來處理表單中有多選一時的情況，搭配value屬性(預設值是"on") 來指定當使用者選取此選項時要傳送給遠端伺服器什麼值。
  要注意的是在同一組radio button的選項，需要都是一樣的name。

• input type="submit" 表單的送出按鈕 (submit button)
  當使用者點了submit button就會送出表單給遠端的伺服器，用value屬性可以設定按鈕名稱。
• input type="reset" 重設表單狀態
  reset 用來讓使用者點了可以重設表單內容回到初始狀態，而value屬性可以設定reset按鈕的名稱。
• input type="hidden" 隱藏資料欄位
  hidden 是用來當你想傳送一些值回遠端server，但你不想或不需要讓使用者看見這些內容。
• input type="image" 圖片送出按鈕
  送出按鈕除了可以用前面提到的文字按鈕，也可以是圖片按鈕。
  圖片送出按鈕還有一個特性是當送出表單時，會同時送出座標點(x, y) 的額外資訊，表示使用者點擊了圖片中的哪個位置，座標軸是以圖片的左上角為(0, 0)。
• input type="file" 檔案上傳
  用來讓使用者可以從本機端選擇檔案上傳。
• input type="button" 表單按鈕
  通常用來搭配 JavaScript 來動態操作表單內容。
• input type="search" 搜尋欄位
  有些瀏覽器可能也會針對搜尋框顯示不同的樣式。
• input type="tel" 電話號碼輸入欄位
  在特定的device像是手機上會顯示針對電話號碼輸入的界面。
• input type="url" 網址輸入欄位
  在送出表單之前，有支援的瀏覽器也會自動驗證 (validate) 使用者輸入的內容是不是合法的URL。
• input type="email" 電子郵件輸入欄位
  在送出表單之前，有支援的瀏覽器也會自動驗證(validate) 使用者輸入的內容是不是合法的email。
• input type="date" 日期輸入欄位
  用來建立一個日期輸入欄位，日期的格式為 yyyy-mm-dd。
• input type="time" 時間輸入欄位
  用來建立一個時間輸入欄位，時間的格式為 24 小時制的 hh:mm。
• input type="number" 數字輸入欄位
  只允許輸入數字。
• input type="range" 數字範圍滑動選取欄位
  可以讓使用者用滑動的方式在一個數字區間內選擇出一個值，可以應用在對數字精準度要求不高的場景。
• input type="color" 顏色選擇器
  用來讓使用者挑選顏色，顏色的格式為 #rrggbb。
  參考資料:https://www.fooish.com/html/input-tag.html
  以上就是今天的內容