HTML5中的input类型包括哪些属性
今天将介绍HTML5中新的输入类型input,这些新功效将大大的帮忙我们实现更多的功效乃至供给更好的会员体验,接下来在文章中将为大家具体介绍input类型的用途。
【引荐课程:HTML5教程】
input类型的属性
(1)email属性:适用于包括 e-mail 地址的输入域,在提交表单时,会主动验证 email 域的值。
当我们输入错误值的时候他会主动提醒要输入准确的格局,并告诉你缺少了什么
<form action="#" method="get"> E-mail:<input type="email" name="email"> <input type="submit"> </form>
结果图
(2)url属性:适用于包括 URL 地址的输入域。在提交表单时,会主动验证 url 域的值。
当输入错误时显示请输入网址
<form action="#" method="get"> URL:<input type="url" name="url"> <input type="submit"> </form>
结果图
(3)number属性:适用于包括数值的输入域。还能够设定对所接受的数字的限制
max:指同意的数字的最大值
min:指同意的数字的最小值
step:指合法的数字间隔,例:step=3代表数字间隔为3
value:默许值
<form action="#" method="get"> Points: <input type="number" name="points" min="1" max="10" /> <input type="submit"> </form>
结果图
(4)range属性:适用于包括必然范畴内数字值的输入域,它的显示为滑动条
max:同意的最大值
min:同意的最小值
step:同意的合法的数字间隔
value:默许值
<form action="#" method="get"> Range: <input type="range" name="points" min="1" max="10" /> <input type="submit"> </form>
(5)search属性:适用于搜索域,比方站点搜索或 Google 搜索。
search 域显示为常规的文本域
<form action="#" method="get"> Search: <input type="search" name="points" min="1" max="10" /> <input type="submit"> </form>
结果图
总结:以上就是本篇文章的全部内容了,但愿通过这篇文章能让大家关于HTML5中的input类型有必然的理解并且可以利用到实际案例中去。
以上就是HTML5中的input类型包括哪些属性的具体内容,更多请关注百分百源码网其它相关文章!