html5的input类型和所有属性详解,input属性中HTML5新增哪些属性
现有输入类型HTML代码示例:复制代码代码如下:
文本输入类型=text
单选按钮输入类型=单选
复选框输入类型=复选框
下拉列表选择选项
密码输入类型=密码
提交按钮输入类型=提交
点击按钮输入type=button
图像按钮输入类型=image
隐藏域输入类型=hidden
重置按钮输入类型=重置
文件输入类型=“文件”
在HTML5中,增加了许多新的表单输入类型。通过使用这些新元素,可以实现更好的输入控制和验证。1、email类型的应用
电子邮件类型的输入元素是专门用于输入电子邮件地址的文本输入框。提交表单时,将自动验证电子邮件输入框的值。复制代码如下:
输入类型=电子邮件名称=用户电子邮件/
2、url类型的应用
url类型的input元素提供了一个文本框,用于输入特殊文本,如url地址。复制代码如下:
输入类型=url 名称=用户url /
3、number类型的应用
number类型的input元素提供了一个用于输入数值的文本框。复制代码如下:
输入类型= number name= number 1 min= 1 max= 20 step= 4 /
4、range类型的应用
类型为range的input元素提供了一个文本框,用于输入特定范围内的数值,该文本框在网页中显示为滚动条。复制代码如下:
输入类型= range name= range 1 min= 1 max= 30 /
5、日期检出类型的应用
HTML代码类型功能描述复制代码代码如下:
日期输入类型=日期
选择年、月、日。
月输入类型=月
选择月份和年份复制代码,如下所示:
周输入类型=周
如下选择周和年复制代码:
时间输入类型=时间
选择复制代码的时间(小时和分钟),如下所示:
日期时间输入类型=日期时间
选择时间、日期、月份和年份(UTC时间)以复制代码,如下所示:
日期时间-本地
Input= datetime-local 选择时间、日期、月份和年份(当地时间)
6、search类型的应用
搜索类型的输入元素提供了一个用于输入搜索关键字的文本框。复制代码如下:
输入类型=search name=search1 /
输入[type=search]{
-WebKit-外观:textfield
}
7、tel类型的应用
tel类型的输入元素提供了一个专用于输入电话号码的文本框。复制代码如下:
输入类型=电话名称=电话/
8、color类型的应用
color类型的input元素提供了一个专门用于设置颜色的文本框。复制代码如下:
输入类型=color name=color /
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。