<!DOCTYPE HTML>
<html>
<head>
<title> New Document </title>
<meta charset='utf-8'>
</head>
<body>
<h2>新增标签</h2>
<section>定义文档中的节，章节，页眉</section>
<article>表示一个独立的，相关的内容块</article>
<nav>导航链接部分</nav>
<aside>用来装载非正文内容，可以被删除，而不会影响正文意思</aside>
<hgroup>对标题元素h1-h6进行整合</hgroup>
<footer>页脚</footer>
<header>页眉</header>
<figure>用于对元素进行组合，多用于图片与图片描述组合</figure>
<p>mark:定义带有标记的文本，突出显示 I <mark>Love</mark> You</p>
<p>progress:定义运行中的任务进程<progress value='45' max='100'></progress></p>
<p>time:定义时间日期 <time>11:23</time></p>
<p>details:定义用户可见的或隐藏的需求补充细节，现在只有chrome支持</p>
<details>
<summary>摘要</summary>
<p>摘要内容</p>
</details>
<p>datalist:定义选项列表，配合input一起使用，定义其可能的值</p>
<input List="list" />
<datalist id="list">
<option value="1">
<option value="2">
<option value="3">
<option value="4">
</datalist>
<p>ruby:定义ruby注释，和rt,rp标签一起使用</p>
<p>menu:定义菜单列表，但是浏览器不支持</p>
<p>command:定义用户可能调用的命令，比如单选按钮，复选框按钮，但是浏览器不支持</p>
<hr>
<hr>
<h2>新增表单功能</h2>
<h3>新增的输入类型</h3>
<p>email:定义email地址的字段</p>
<p>url：定义用于输入url的字段</p>
<p>number:定义输入数字的字段</p>
<p>range:用于定义精确值不重要的输入数字控件</p>
<p>Date Pickers:date定义date控件，month定义month和year控件，week定义week和year控件，time定义用于输入时间的控件，datetime定义date和time的控件基于UTC时间，datetime-local定义date和time控件不带时区</p>
<p>search：定义用于输入搜索字符串的文本字段</p>
<p>tel：定义用于输入电话号码的字段</p>
<p>color：定义拾色器</p>
<div>
<form action="#" method="get">
<div>emial:<input type="email" name="email"/></div>
<div>url:<input type="url" name="url"/></div>
<div>number:<input type="number" name="number" value="1" max="100" min="1" step="2"/></div>
<div>range:<input type="range" name="range" value="1" max="100" min="1" step="1"/></div>
<div>data picker-date:<input type="date" name="date"/></div>
<div>data picker-month:<input type="month" name="month"/></div>
<div>data picker-week:<input type="week" name="week"/></div>
<div>data picker-time:<input type="time" name="time" value='23:24:30' min="01:00" max="10:23:39" step="1"/></div>
<div>data picker-datetime:<input type="datetime" name="datetime"/></div>
<div>data picker-datetime-local:<input type="datetime-local" name="datetime-local"/></div>
<div>search:<input type="search" name="search"/></div>
<div>tel:<input type="tel" name="tel"/></div>
<div>color:<input type="color" name="color"/></div>
<input type="submit" value="提交">
</form>
</div>
<h3>新增的输入input属性</h3>
<p>autocomplete:规定input标签是否启动自动完成功能</p>
<p>autofocus:当页面加载时，input是否自动获取焦点</p>
<p>form:规定input标签所属的表单</p>
<p>新增的表单属性:<mark>formaction</mark>规定当表单提交时处理输入控件的文件的URL。<mark>formenctype</mark>确定表单提交到服务端上时如何编码
<mark>formmethod</mark>表单提交的http方法。<mark>formtarget</mark>规定表单提交成功后在哪里接受响应的名称或关键词<mark>formnovalidate</mark>覆盖form标签中的novalidate属性
<mark>除了formnovalidate，其他的属性都是针对input标签type=submit，和type=image类型</mark>
</p>
<p>height和width:用来规定input标签的长度宽度，但是只是针对type=image</p>
<p>list:属性引用datalist元素，其中包含了input元素的预定义选项</p>
<p>min,max,step:min规定输入框最小输入值，max规定最大值，step规定输入合法的数字间隔</p>
<p>multiple:属性规定输入到input的多个值，如上传文件可以传多个</p>
<p>pattern:规定用于验证输入的正则表达式</p>
<p>placeholder:输入input的简短提示</p>
<p>required:规定表单提交之前填写输入字段</p>
</body>
</html>
07-19
387
387
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
