- input:email/url/range/Date picker/search/color/tel
- 表单属性:autocomplete/autofocus/multiple/placeholder/required
- 链接属性:<link>的size属性/<base>的target属性/超链接<a>
- 其他属性:script/ol/html/style
Email:
<input type="email" name="email"/>
在电脑端不会有什么区别,但是在手机端,手机键盘上会有@和.符号,都是email所必须的。
url:统一资源定位符Input类型
<input type="url" name="url"/>
会出现特殊的键盘,输入一个网址,只会用到字母加数字,偶尔会有大写字母,网址的域名一般都会有(.), 二级域名有/,百分之九十的域名都会有.com。安卓的url和普通的一样,如果下载输入法的话,就会自动识别.com、.cn。
tel:
<input type="tel" name="tel"/>
number:在电脑端能看出不同。只能输入可以参与运算的数字、-+.e
<input type="number" name="number"/>
date pickers:
- Date——选取日、月、年
- Month——选取月、年
- Week——选取周和年
- Time——选取事件(小时和分钟)
- Datetime——选取时间、日、月、年(UTC时间)
- Datetime-local——选取时间、日、月、年(本地时间)
Datetime和Datetime-local区别:
- 兼容性:Datetime只有safari和opera浏览器能够兼容。Datetime-local只有chrome和safari和opera能够兼容。IE和火狐读不出来这两个区别
- Datetime-local本地时间,返回的是当前的年月日。Datetime是区时,返回的除了年月日还会返回区时。
<body>
date: <input type="date" name="date"/><br/>
month: <input type="month" name="month"/> <br/>
week: <input type="week" name="week"/> <br/>
time: <input type="time" name="time"/> <br/>
datetime: <input type="datetime" name="datetime"/> <br/>
datetime-local: <input type="datetime-local" name="datetime-local"/> <br/>
</body>
range/search/color:
<body>
<input type="range" name="range" min="1" max="10"/><!--默认从1-100-->
<input type="search" name="search"/><!--IE下,有值的时候出现叉号可删除元素-->
<input type="color" name="color"/>
</body>