html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

工具HBuilder技术HTML5CSS3在HTML5中,新增了很多的属性,如video、canvas等。其中,input输入框的属性type也增加了几个。下面利用实例说明:操作说明:1、type属性常用的有button,表示按钮butt

工具HBuilder技术HTML5CSS3 在HTML5中,新增了很多的属性,如video、canvas等。其中,input输入框的属性type也增加了几个。下面利用实例说明:

操作说明:

1、type属性常用的有button,表示按钮

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

button

2、input的type属性还可以使用checkbox,表示复选框

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

checkbox

3、HTML5中新增属性type="color",设置颜色选择器

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

color

4、保存代码并打开浏览器,可以颜色选择器的效果

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

颜色选择器

5、type属性值设置为date,表示日期选择器

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

date

6、日期选择器效果,显示年月日

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

日期选择器效果

7、type属性值为datetime-local,当地时间

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

datetime-local

8、时间选择器,默认显示年月日时分

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

时间选择器

9、如果要控制输入框输入电子邮件,type属性设置为email

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

email

10、文件上传功能,可以使用type=file

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

file

11、文件上传效果

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

文件上传效果

12、type属性设置为image,显示图片

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

image

13、image图片显示效果

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

image图片显示效果

14、如果在传值过程中,想要控件不显示,但是存储值,可以使用hidden

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

hidden

15、type属性值为number

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

number

16、如果要使输入的文字设置为密码格式,可以使用password

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

password

17、设置input为单选按钮,可以设置为radio

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

radio

18、包含一定范围内数字值的输入域,可以使用range

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

range

19、对应用户登录功能,有个重置功能,可以使用reset

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

reset

20、类似浏览器搜索框一样,input的type属性设置为search,表示搜索框

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

search

21、表单提交时,常用submit提交

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

submit

22、如果想要输入框输入电话,并进行验证,可以设置为tel

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

tel

23、input最常用的功能是输入框,type值为text

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

text

24、如果想要输入框变为时间选择器,type属性设置为time

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

time

25、input控件的type属性还可以输入地址,type值为url

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

url

26、如果想要输入框可以选择周,type属性值设置为week

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

week

27、week显示周的效果

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

html5中input元素的type属性设置(在html中,表单中的input元素的type属性)

HTML5+CSS3+JavaScript从入门到精通(标准版) web前端开发网页设计丛书 月销量500好评率99%无理由退换 配送¥89.6购买

本站部分文章来自网络或用户投稿,如无特殊说明或标注,均为本站原创发布。涉及资源下载的,本站旨在共享仅供大家学习与参考,如您想商用请获取官网版权,如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
投稿

老机型升级ios14.8(iphone8升级ios14.0.1)

2022-8-5 22:26:24

投稿

三亚周边自驾旅游景点(三亚旅游必去十大景点推荐)

2022-8-5 22:26:36

搜索