手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

HTML5中新增的Input类型有哪些

时间:2024-10-23 20:16:37

1、新建一个HTML5页面,文件命为test.html,用于测试说明input新增的type类型。

HTML5中新增的Input类型有哪些

2、新增了type="email"类型,在form表单中提交数据的过程中,这种类型会自动对输入框的内容进行验证,验证是否是邮件地址。

HTML5中新增的Input类型有哪些
HTML5中新增的Input类型有哪些

3、新增了type="url"类型,当输入的内容非网址,会以红框显示当前输入不正确。

HTML5中新增的Input类型有哪些
HTML5中新增的Input类型有哪些

4、新增了type="num水瑞侮瑜ber"类型,当在输入框中输入内容不是数字时,会以红框提示吹涡皋陕用户输入错误。number类型还可以设置min最小值,max最大值,并在输入框的末端出现箭头,可以调整数值。

HTML5中新增的Input类型有哪些
HTML5中新增的Input类型有哪些

5、新增了type="range"类型,此类型实现了类似于滑动条的效果,可以滑动,在该类型中可以实现min最小值和max最大值的设置。

HTML5中新增的Input类型有哪些
HTML5中新增的Input类型有哪些

6、新增了type="date"类型, 此类型只要给一个时间的默认值,就可以不需要JS的情况实现日期的选择。

HTML5中新增的Input类型有哪些
HTML5中新增的Input类型有哪些

7、新增了type="search"类型,当输入框为此类型时,输入内容后,在输入框的末端会出来一个叉号,可对内容进行清空。

HTML5中新增的Input类型有哪些
HTML5中新增的Input类型有哪些
© 手抄报圈