用了許久的html,<input>這個標簽是最常用的標簽之一。
<input type="">標簽中type屬性是必不可少的,以往我最常用的有 type="text"(單行文本輸入) 類型、 type="button"(按鈕類型)、 type="password"(密碼輸入框)等。卻忽略了很多很實用卻很少用到的屬性,這里重新整理一下。
在HTML5中,規定的 input type 屬性值如下:
1.button 定義可點擊按鈕
2.checkbox 復選框
<form action="demo-form.php"> <input type="checkbox" name="vehicle[]" value="Bike"> 我有一輛自行車<br> <input type="checkbox" name="vehicle[]" value="Car"> 我有一輛小轎車<br> <input type="checkbox" name="vehicle[]" value="Boat"> 我有一艘船<br> <input type="submit" value="提交"> </form>
3.color 定義拾色器,定義后出現顏色調板,只支持谷歌和opera
4.date 定義 date 控件(包括年、月、日,不包括時間)。只支持谷歌、opera、safari
5.datetime 定義date和time空間,僅支持safari、opera
6.datetime-local 定義date和time空間。只支持谷歌、opera、safari
7.email 定義用於e-mail地址字段,提交時會驗證。safari不支持
8.file 上傳文件
9.hidden 定義隱藏字段
10.image 定義圖像為提交按鈕
<input type="image" src="img_submit.gif" alt="Submit">
11.month 定義month和year空間。只支持谷歌、opera、safari
12.number 定義數字輸入的字段。只支持谷歌、opera、safari
數量 ( 1 到 5 之間): <input type="number" name="quantity" min="1" max="5">
13.password 定義密碼字段
14.radio 單選項
<form> <input type="radio" name="gender" value="女"> 女<br> <input type="radio" name="gender" value="女"> 男<br> </form>
15.range 定義用於精確值不重要的輸入數字的控件(比如 slider 控件)。您也可以設置可接受數字的限制:
<input type="range" name="points" min="1" max="10">
16.reset 定義重置按鈕,重置為初始值
17.search 定義搜索字段。只支持谷歌、opera
18.submit 定義提交按鈕
19.tel 定義輸入電話號碼字段,注:目前主流瀏覽器都不支持
20.text 文本
21.time 定義輸入時間 IE和火狐不支持
22.url 輸入url字段,蘋果瀏覽器不支持
23.week 定義week和year控件,IE和火狐不支持