input新增属性：

最新推荐文章于 2024-06-29 09:07:16 发布
最新推荐文章于 2024-06-29 09:07:16 发布
阅读量453 收藏 1
点赞数
分类专栏： HTML5 文章标签： input新增属性：
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Liyunhao_haoge/article/details/101895102
版权

input新增属性：
email
语法：<input type="email" name="">
说明：输入邮箱格式

tel
语法：<input type="tel" name="">
说明：输入手机号码格式

nember
语法：<input type="number" name="">
说明：输入数字格式

url
语法：<input type="url" name="">
说明：输入url格式

search
语法：<input type="search" name="">
说明：输入搜索框(体现语义化),后面多了个删除全部的红叉

range
语法：<input type="range" name="">
说明：自由拖动滑块

time
语法：<input type="time" name="">
说明：小时分钟

date
语法：<input type="date" name="">
说明：年月日

datetime
语法：<input type="datetime" name="">
说明：时间

month
语法:<input type="month" name="">
说明:月年

week
语法:<input type="week" name="">
说明:星期 年

color
语法:<input type="color" name="">
说明:颜色

 

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<fieldset>
		<legend>HTML5新增属性验证效果</legend>
		<form>
			邮箱:<input type="email" name=""><br />
			手机:<input type="tel" name=""><br />
			数字:<input type="number" name=""><br />
			URL:<input type="url" name=""><br />
			搜索:<input type="search" name=""><br />
			滑块:<input type="range" name=""><br />
			时分:<input type="time" name=""><br />
			年月日:<input type="date" name=""><br />
			时间:<input type="datetime" name=""><br />
			月年:<input type="month" name=""><br />
			week:<input type="week" name=""><br />
			颜色:<input type="color" name=""><br />
			<input type="submit" name=""><br />
		</form>
	</fieldset>
</body>
</html>

效果如下：

纯情小码哥
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
web前端入门到实战：HTML5中input新增类型+表单新增属性+其他标签属性
前端工程师年薪30万，就靠这套教程！持续更新最新知识
04-16 402
Input 新增属性 email  邮箱（只在手机端有效） url  网址（只在iphone手机有效） tel  手机号（只在手机端有效） number  数字（右侧有上下按钮，只能输入数字，+号，-号，. 和e） input 日期时间（手机端效果比较好） date 年月日 time 小时和分 datetime 年月日+小时和分 （iphone和...
input H5新特性
qq_34599639的博客
09-26 1248
H5 属性 方法 控件
html5中input标签增加的属性
dancheng1的博客
10-28 2166
1、新增的autocomplete属性 autocomplete属性有3中值：on、off和空值 默认状态下表单的autocomplete处于打开状态 效果：出现上次输入的提示   2、新增的autofocus属性 效果：使文本框获得焦点 注意：在同一个界面中只能有一个autofocus属性   3、新增的form属性 提交" />   4、新增表单重写
input的23种属性
最新发布
2301_81449444的博客
06-29 367
datetime-local 定义 date 和 time 控件（包括年、月、日、时、分、秒、几分之一秒，不带时区）。datetime 定义 date 和 time 控件（包括年、月、日、时、分、秒、几分之一秒，基于 UTC 时区）。range 定义用于精确值不重要的输入数字的控件（比如 slider 控件）。date 定义 date 控件（包括年、月、日，不包括时间）。time 定义用于输入时间的控件（不带时区）。url 定义用于输入 URL 的字段。
input标签，新增那些属性
读心悦
09-14 423
input标签作为页面与用户交互的重要入口，了解掌握input的属性，至为重要。
html5中input新增属性
第十七签
06-18 1346
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" type="text/html;charset=GBK-2312"> <title>HTML5新增的Input元素</title> </head> <body> <form action=""> <p
HTML5，input新增的属性
a877189987的博客
12-15 2180
1、新增的autocomplete属性 <input type="url" name="url1" autocomplete="on" /> autocomplete属性有3中值：on、off和空值 默认状态下表单的autocomplete处于打开状态 效果：出现上次输入的提示 2、新增的autofocus属性 效果：使文本框获得焦点 注意：在同一个界面中只能有一个autofocus属性 <input type="text" name="user_name" autof
HTML5 input新增type属性color颜色拾取器的实例代码
09-22
`type="color"` 是HTML5中新增的`input`类型，它用于创建一个颜色选择器，允许用户从颜色选取器中选择颜色。下面是一个关于`type="color"`的简单实例： ```html <!DOCTYPE html> , initial-scale=1.0"> ...
HTML5新增的input属性你知道多少？
丑小鸭变黑天鹅的博客
03-16 1511
HTML5新增的input属性你知道多少？1、必要（Required）属性2、自动对焦（Autofocus）属性3、pattern 属性4、multiple 属性5、min、max 和 step 属性6、 占位符（placeholder属性）7、电子邮件输入8、list 属性9、height 和 width 属性 1、必要（Required）属性 表单允许新的必要属性，规定是否某个特定的输入是必要的。你可以依据自己写代码的偏好，用下面两种不同方式来声明这个属性： required 属性适用于以下类型的 &l
HTML5 input元素类型：email及url介绍
09-28
本文将详细介绍两个新增的input元素类型：email和url。 ### HTML5 input元素类型 HTML5的input元素是表单元素中的重要组成部分，它允许用户在网页上输入数据。input元素通过type属性来指定输入字段的类型，比如...
HTML5表单中新增的input属性3.pdf
07-11
以下是四个主要的新增属性的详细说明： 1. **multiple** 属性： 在HTML5之前，`input`元素的`type="file"`只能让用户选择一个文件进行上传。然而，`multiple`属性的引入允许用户一次性选择多个文件进行上传。这...
HTML5新增input标签属性
qq_44899153的博客
06-21 862
1.新增的type属性值 类型**** 使用示例**** 含义**** email**** <input type="email"> 输入邮箱格式 tel**** <input type="tel"> 输入手机号码格式 url**** <input type="url"> 输入url格式 numb...
HTML5 新增加input属性
沉淀，积累、进步
12-20 526
参考别的网页，网页来源最下方，整理笔记如下 autocomplete：规定表单或输入字段是否应该自动完成。 autofocus：属性是布尔属性。如果设置，则规定当页面加载时 元素应该自动获得焦点。 form：规定 元素所属的一个或多个表单。如需引用一个以上的表单，请使用空格分隔的表单 id 列表。 formaction：规定当提交表单...
input的新类型（新控件）与input的新属性
Ma10110517的博客
04-18 275
input新增： email : 提交表单时检测值是否是一个电子邮件格式 url: 提交表单时检测值是否是一个url格式 date: 年-月-日格式的控件 time: 时:分格式的控件 datetime-local : 年-月-日 时:分 格式的控件（本地时间） month : 年-月格式的控件 week: 年-周数格式的控件 number: 数字输入框 Range : 选择区域 tel: 电话输入框 search: 用于搜索 color: 调用系统选色器 input新属性 placeholder: 占位符
js使用attr给input添加属性，其他select或者radio类似
one_dayR的博客
10-31 3538
例如给id为测试Id添加不可操作属性： $('#ceshiId').attr('disabled','true');
HTML5 input常见新增类型及属性
VisonYH的博客
03-17 3909
1. url类型、email、tel类型 说明：当输入非url、email的字符串时，浏览器会自动提醒。 &lt;form action="/example/html5/demo_form.asp"&gt; &lt;input type="url"&gt; &lt;input type="submit" value="提交"&gt; &lt;/form&
html5 新增input类型,html5新增的input类型
weixin_42697475的博客
06-09 3364
html5新增的input类型你可能已经听说过现在HTML5里引入了几种新的input类型，在HTML5之前，大家熟知的input类型包括：text(文本输入框)，hidden(隐藏域)，submit(提交按钮)等。而HTML5到来之后，新增的input类型包括： email (e-mail 地址)，date(日期)，number(数字)等等。下面我们来看看HTML5中新增input类型都有哪些吧...
html5中input标签新增的属性
李青不吃螺蛳粉的博客
03-26 584
input 标签的 type 属性新增的值 HTML 5 新增的 type 属性的值： email、url、number、search、tel、range、color、date、month、week、time、datetime-local ① 文本输入类 <!-- 邮箱输入框 --> <input type="email" placeholder="请输入邮箱"> <br> <br> <!-- URL 输入框 --> <input type
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值