已經(jīng)有的輸入類型HTML代碼示例:復制代碼代碼如下:文本域&l;ipuype=&quo;ex&quo;&g;單選按鈕&l;ipuype=&quo;adio&quo;&g;復選框&l;ipuype=&quo;checkbox&quo;&g;下拉列表&l;elec&g;&l;opio&g;密碼域&l;ipuype=&quo;pawod&quo;&g;提交按......
以下是【金聰采編】分享的內容全文:
以下是【金聰采編】分享的內容全文:
已經(jīng)有的輸入類型 HTML代碼示例:
復制代碼
代碼如下:文本域 <input type="text">
單選按鈕 <input type="radio">
復選框 <input type="checkbox">
下拉列表 <select><option>
密碼域 <input type="password">
提交按鈕 <input type="submit">
可單擊按鈕 <input type="button">
圖像按鈕 <input type="image">
隱藏域 <input type="hidden">
重置按鈕 <input type="reset">
文件域 <input type="file">
在HTML5中,增加了多個新的表單input輸入類型,通過使用這些新增元素,可以實現(xiàn)更好的輸入控制和驗證。
1、email類型的應用
email類型的input元素是一種專門用于輸入E-mail地址的文本輸入框,在提交表單的時候,會自動驗證email輸入框的值。
復制代碼
代碼如下:<input type="email" name="user_email" />
2、url類型的應用
url類型的input元素提供用于輸入url地址這類特殊文本的文本框。
復制代碼
代碼如下:<input type="url" name="user_url" />
3、number類型的應用
number類型的input元素提供用于輸入數(shù)值的文本框。
復制代碼
代碼如下:<input type="number" name="number1" min="1" max="20" step="4" />
4、range類型的應用
range類型的input元素提供用于輸入包含一定范圍內數(shù)字值得文本框,在網(wǎng)頁中顯示為滾動條。
復制代碼
代碼如下:<input type="range" name="range1" min="1" max="30" />
5、日期檢出類型的應用
輸入類型 HTML代碼 功能說明
復制代碼
代碼如下:date <input type="date">
選取日、月、年
month <input type="month">
選取月、年
復制代碼
代碼如下:week <input type="week">
選取周和年
復制代碼
代碼如下:time <input type="time">
選取時間(小時和分鐘)
復制代碼
代碼如下:datetime <input type="datetime">
選取時間、日、月、年(UTC時間)
復制代碼
代碼如下:datetime-local
<input type="datetime-local"> 選取時間、日、月、年(本地時間)
6、search類型的應用
search類型的input元素提供用于輸入搜索關鍵詞的文本框。
復制代碼
代碼如下:<input type="search" name="search1" />
input[type="search"]{
-webkit-appearance:textfield;
}
7、tel類型的應用
tel類型的input元素提供專門用于輸入電話號碼的文本框。
復制代碼
代碼如下:<input type="tel" name="tel" />
8、color類型的應用
color類型的input元素提供專門用于設置顏色的文本框。
復制代碼
代碼如下:<input type="color" name="color" />

侵權舉報/版權申訴



