工具HBuilder技术HTML5CSS3 在HTML5中,新增了很多的属性,如video、canvas等。其中,input输入框的属性type也增加了几个。下面利用实例说明:
操作说明:
1、type属性常用的有button,表示按钮
button
2、input的type属性还可以使用checkbox,表示复选框
checkbox
3、HTML5中新增属性type="color",设置颜色选择器
color
4、保存代码并打开浏览器,可以颜色选择器的效果
颜色选择器
5、type属性值设置为date,表示日期选择器
date
6、日期选择器效果,显示年月日
日期选择器效果
7、type属性值为datetime-local,当地时间
datetime-local
8、时间选择器,默认显示年月日时分
时间选择器
9、如果要控制输入框输入电子邮件,type属性设置为email
10、文件上传功能,可以使用type=file
file
11、文件上传效果
文件上传效果
12、type属性设置为image,显示图片
image
13、image图片显示效果
image图片显示效果
14、如果在传值过程中,想要控件不显示,但是存储值,可以使用hidden
hidden
15、type属性值为number
number
16、如果要使输入的文字设置为密码格式,可以使用password
password
17、设置input为单选按钮,可以设置为radio
radio
18、包含一定范围内数字值的输入域,可以使用range
range
19、对应用户登录功能,有个重置功能,可以使用reset
reset
20、类似浏览器搜索框一样,input的type属性设置为search,表示搜索框
search
21、表单提交时,常用submit提交
submit
22、如果想要输入框输入电话,并进行验证,可以设置为tel
tel
23、input最常用的功能是输入框,type值为text
text
24、如果想要输入框变为时间选择器,type属性设置为time
time
25、input控件的type属性还可以输入地址,type值为url
url
26、如果想要输入框可以选择周,type属性值设置为week
week
27、week显示周的效果
HTML5+CSS3+JavaScript从入门到精通(标准版) web前端开发网页设计丛书 月销量500好评率99%无理由退换 配送¥89.6购买