① url類型

url類型的input元素是一種專門用來輸入URL地址的文本框。提交時如果該文本框中的內容不是URL地址格式的文字，則不允許提交。

非url提交時Firefox、Chrome 提示錯誤，Opera自動將url框中值轉化為url格式，ie9和safari不支持，正常提交

② email類型

email類型的input元素是一種專門用來輸入email的文本框。提交時如果該文本框中的內容不是email地址格式的文字則不允許提交，但是它并不檢查email地址是否存在，提交時該文本框可以為空，除非加上了?屬性。

email類型的文本框具有一個?multiple?屬性——它允許在該文本框中輸入一串以逗號分割的email地址。當然并不強制要求用戶輸入該email地址列表。

Firefox、Chrome、Opera 非email提交時提示錯誤，支持required，ie9和safari不支持，正常提交

③ date類型

date類型的input元素是深受開發者喜愛的一種元素我們也經常看到網頁中要求我們輸入的各種各樣的日期，例如生日、購買日期、訂票日期等。date類型的input元素以日歷的形式方便用戶輸入。當該文本框獲取焦點時，顯示日歷，可以在日歷總選擇日期進行輸入。

Opera點擊彈出一個日歷下拉框，但不允許手動輸入。Chrome、Safari表現一致，但Safari在提交時沒有驗證，在輸入框右側有上下兩個按鈕，點擊加減天，Firefox、ie9不支持

④ time類型

time類型的input元素是一種專門用來輸入時間的文本框，并且在提交時會對輸入時間的有效性進行檢查。它的外觀取決于瀏覽器。

Opera類似系統的時間設置框。Chrome、Safari表現一致，但Safari在提交時沒有驗證，在輸入框右側有上下兩個按鈕，點擊加減分鐘，Firefox、ie9不支持

⑤ datetime類型

datetime類型的input元素是一種專門用來輸入UTC日期和時間的文本框，并且在提交時會對輸入的日期和時間進行有效性檢查。

Opera支持的最好，很類似date和time的組合。Chrome、Safari表現一致，但Safari在提交時沒有驗證，在輸入框右側有上下兩個按鈕，點擊加減分鐘，Firefox、ie9不支持

⑥ datetime-local類型

datetime-local類型的input元素是一種專門用來輸入本地日期和時間的文本框，并且在提交時會對輸入的日期和時間進行有效檢查。

Opera中和datetime表現上的區別就是末尾少了個UTC。Chrome、Safari表現一致，但Safari在提交時沒有驗證，Firefox、ie9不支持

⑦ month類型

month類型的input元素是一種專門用來輸年月份的文本框，并且在提交時會對輸入的月份進行有效檢查。

Opera中和date類似，只是只能選擇到月份。Chrome、Safari表現一致，但Safari在提交時沒有驗證，Firefox、ie9不支持

⑧ week類型

week類型的input元素是一種專門用來輸周號的文本框，并且在提交時會對輸入的周號進行有效檢查。

Opera提供下拉選擇，不允許手動輸入。Chrome、Safari表現一致，但Safari在提交時沒有驗證，Firefox、ie9不支持

⑨ number類型

number類型的input元素是一種專門用來輸數字的文本框，并且在提交時會對輸入的內容是否為數字。它們具有?min、max?與?step?屬性。 帶有數值控制按鈕，以控制其數值，使之不超過最大值于最小值，同時在點擊該數值控制按鈕時，其中的數值會按step屬性進行增減，當然也可以直接在其中輸入數字。

Opera、Chrome、Safari表現一致，但Safari在提交時沒有驗證，Firefox、ie9不支持

⑩ range類型

range類型的input元素是一種只允許輸入一段范圍內數值的文本框，它具有min屬性與max屬性，可以設定最小值與最大值(默認為0與100)，它還具有step屬性，可以制定每次拖動的維度，用滑動條的方式進行值的制定。

Opera中滑條帶刻度、Chrome、Safari不帶，Firefox、ie9不支持

⑾ search類型

search類型的input元素是一種專門用來輸入搜索關鍵詞的文本框的文本框。search類型與text類型僅僅在外觀上有卻別。在Safari瀏覽器中，它的外觀為操作系統默認的圓角矩形文本框，但這個外觀可以用css央視表進行改寫。在其他瀏覽器中，TA的外觀暫與text類型的文本框外觀相同，但可以用css樣式表進行改寫。(-webkit-appearance:textfield)

Safari和Chrome在輸入框有內容時會默認在輸入框右邊出現一個×

⑿ tel類型

tel類型的input元素被設計為用來輸入電話號碼的專用文本框。它沒有特殊的校驗規則，不強制輸入數字(因為許多電話號碼通常帶有其他文字)，譬如86-010-86670831.但是開發者可以通過?pattern屬性來制定對于輸入的電話號碼格式的驗證。

Safari和ie不支持

⒀ tel類型

color類型的input元素用來選取顏色，它提供了一個顏色選取器。目前它只在Opear瀏覽器與BlackBerry瀏覽器中被支持。

Safari和ie不支持

總結

以上是生活随笔為你收集整理的html5 规定input域,html5中关于input用法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。