HTML5 Input 类型的详细介绍以及实例代码(2)-木庄网络博客

当前第2页返回上一页

max- 规定允许的最大值

min - 规定允许的最小值

step - 规定合法的数字间隔（如果 step="3"，则合法的数是 -3,0,3,6 等）

value - 规定默认值

尝试一下带有所有限定属性的例子尝试一下

Input 类型: range

range 类型用于应该包含一定范围内数字值的输入域。

range 类型显示为滑动条。

实例

定义一个不需要非常精确的数值（类似于滑块控制）:

1	`<input` `type="range"` `name="points"` `min="1"` `max="10">`

请使用下面的属性来规定对数字类型的限定：

max - 规定允许的最大值

min - 规定允许的最小值

step - 规定合法的数字间隔

value - 规定默认值

Input 类型: search

search 类型用于搜索域，比如站点搜索或 Google 搜索。

实例

定义一个搜索字段 (类似站点搜索或者Google搜索):

1	`Search Google: <input` `type="search"` `name="googlesearch">`

Input 类型: tel

实例

定义输入电话号码字段:

1	`电话号码: <input` `type="tel"` `name="usrtel">`

Input 类型: time

time 类型允许你选择一个时间。

实例

定义可输入时间控制器（无时区）：

1	`选择时间: <input` `type="time"` `name="usr_time">`

Input 类型: url

url 类型用于应该包含 URL 地址的输入域。

在提交表单时，会自动验证 url 域的值。

实例

定义输入URL字段:

1	`添加您的主页: <input` `type="url"` `name="homepage">`

提示: iPhone 中的 Safari 浏览器支持 url 输入类型，并通过改变触摸屏键盘来配合它（添加 .com 选项）。

Input 类型: week

week 类型允许你选择周和年。

实例

定义周和年 (无时区):

1	`选择周: <input` `type="week"` `name="week_year">`

【相关推荐】

1. 特别推荐：“php程序员工具箱”V0.1版本下载

2. 免费h5在线视频教程

3. php.cn原创html5视频教程

以上就是HTML5 Input 类型的详细介绍以及实例代码的详细内容，更多文章请关注木庄网络博客！

返回前面的内容

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者

转载请注明出处：木庄网络博客 » HTML5 Input 类型的详细介绍以及实例代码

相关推荐

评论