<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--form可以与table一起使用-->
<!--action属性指定表单数据提交到哪里去
method属性：指定网络请求的方式(默认方式为get)
（1）get请求 传递到服务端的数据以追加到URL路径后的方式发送
规则：所有数据都在？之后，多个数据以&符号进行分割
优点：数据传送比较直观，适合传输小批量数据，服务端处理比较方便
缺点：1网络请求数据直接暴露在URL里面，敏感数据易被窃取
2数据传输量比较小，限定长度为255个字节
(2)post请求
传递到服务器端的数据隐藏起来，放在请求体里面，达到隐藏敏感数据的效果
优点：1相对于get请求，传输数据的隐秘性较好
2数据传输量基本上不存在上限
-->
<!--name属性：数据要组成键值对的方式发送，否则不能获取数据-->
<!--fieldset 个表单加个框，legend个框加个标题说明-->
<!--tabindex="1" 设置按tab键跳到哪个框去，再次按会跳到tabindex="框中2"的-->
<!-- input的类型 name属性必须添加！！！！为了正常提交数据到服务器
type="text"：单行输入文本 如果type="password"密码隐藏
type=radio
单选框 互斥效果通过同名name实现 ，用value组成键值对
默认认为name相同的为一组，为互斥的，如只能选男不能同时选男和女
而传递到服务器端的数据只显示状态为ON，设置value后就行
type="checkbox" 复选框
type="submit 提交按钮，默认value值为提交
type="reset" 重置按钮
type="file" 添加附件，提交一个文件名（后面会细讲）
type="image"src="图片按钮
type="button" value="普通个按钮
type="select" 下拉列表 size显示下拉个数的大小，size="2"设置展开2 ，
multiple：下拉数据可同时选择多个，按住ctrl为多选
type="textarea" 文本域 rol和cols定义文本域的大小
写法：<textarea></textarea>
设置宽高style="width: 200px; height: 150px;" 自身有cols="" rows=""两个属性，但不常用
readonly="readonly" 设置为只读模式，不允许编辑。
style="resize: none;" 设置为宽高不允许修改。
style="overflow: ;" 设置当文字超出区域时，如何处理。
>>> 也可以通过overflow-x/overflow-y分别设置水平垂直方向的显示方式。
>>> 常用属性值:hidden 超出区域的文字，隐藏无法显示
scroll 无论文字多少，均会显示滚动
auto 自动，根据文字多少自动决定是否显示滚动条（默认样式 <!--给form添加ID，在表单外面的元素添加form=“表单ID”，也可以提交数据
H5新增input的form属性，用于指向特定form表单的id，实现input无需放在form标签之中，即可通过表单进行提交。
--><!-- 表单input属性新东西 placeholder为input的提示信息 placeholder="请输入密码" autocomplete="off"/ 自动补全的关开 autofocus 光标自动放在框中 required必填项- email、URL、date、time、month、week、number、range、color
input元素的新增属性：
Autocomplete：自动完成功能.记录用户之前输入的内容，并在下次输入时自动提示完成输入。
>>> 属性值： on/off
>>> 可以在form表单上使用，对整张表单的所有控件进行自动完成的开关
也可以在input上使用，对特定输入框进行修改。
>>> 绝大部分浏览器，默认开启。
Autofocus：自动获得焦点. autofocus="autofocus",只能设置input元素自动获得焦点。
Form：所属表单。通过form表单的id，确定此input输入哪张表单。
Required：必填.required="required" 设置input必填，否则阻止提交。
Pattern：使用正则表达式验证input的模式（后续讲解）
Placeholder：提示内容，当有value时，取消提示。-->-><!--HTML5提供多种输入风格，美化页面input type=-->
<form action="Test.html" method="get" id="foo">
<fieldset>
<legend>登陆注册</legend>
<table>
<tr>
<td>会员名：</td>
<td><input type="text" name="name" tabindex="1" autocomplete="off"
autofocus required placeholder="请输入会员名" value="冥王的左手"
readonly/></td>
<td>(可包含a-z,0-9和下划线）</td>
</tr>
<tr>
<td>密码：</td>
<td><input type="password" name="pwd" placeholder="请输入密码"/></td>
<td>(至少包含六个字符）</td>
</tr>
<tr>
<td>密码：</td>
<td><input type="password" name="pwd" tabindex="2"/></td>
<td>(至少包含六个字符）</td>
</tr>
<tr>
<td>性别</td>
<td><input type="radio" name="sex" value="man"/>男</td>
<td><input type="radio" name="sex" value="women"/>女</td>
</tr>
<tr>
<td>爱好</td>
<td>
<input type="checkbox" name="hobby" value="basketball"/> 篮球
<input type="checkbox" name="hobby" value="football"/>足球
<input type="checkbox" name="hobby" value="pingpang"/> 乒乓球
</td>
</tr>
<tr>
<td>附件</td>
<td><input type="file"/></td>
</tr>
<tr>
<td>图片按钮</td>
<td><input type="image" src="../../img/2.png" width="40"/></td>
</tr>
<tr>
<td>普通按钮</td>
<td><input type="button" value="普通按钮"/></td>
</tr>
<tr>
<td>普通按钮</td>
<td>
<button>普通按钮</button>
</td>
</tr>
<tr>
<td>爱好</td>
<td colspan="2">
<select name="hobby1" id="hobby1" multiple size="2">
<option value="1">q</option>
<option value="2">w</option>
<option value="3">e</option>
<option value="4">r</option>
</select>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td>协议</td>
<td colspan="2">
<textarea cols="25" rows="5">
杰瑞教育！！ 杰瑞教育！！ 杰瑞教育！！ 杰瑞教育！！ 杰瑞教育！！
</textarea>
</td>
</tr>
<tr>
<td><input type="submit" value="123"/></td>
<td><input type="reset"/></td>
</tr>
<tr>
<td colspan="3" align="center"><input type="submit"/></td>
</tr>
</table>
</fieldset>
</form>
<input type="text" name="nick" placeholder="请输入昵称" form="foo"/>
<form action="Test.html">
<fieldset>
<legend>h5新增表单属性</legend>
<table>
<tr>
<td>邮箱</td>
<td><input type="email" name="email"/></td>
</tr>
<tr>
<td>地址</td>
<td><input type="url" name="url"/></td>
</tr>
<tr>
<td>日期</td>
<td><input type="date" name="data"/></td>
</tr>
<tr>
<td>时间</td>
<td><input type="time" name="time"/></td>
</tr>
<tr>
<td>月份</td>
<td><input type="month" name="month"/></td>
</tr>
<tr>
<td>星期</td>
<td><input type="week" name="week"/></td>
</tr>
<tr>
<td>数字格式</td>
<td><input type="number" name="number"/></td>
</tr>
<tr>
<td>滑动条</td>
<td><input type="range" name="range"/></td>
</tr>
<tr>
<td>选择颜色</td>
<td><input type="color" name="color"/></td>
</tr>
<tr>
<td><input type="submit" name="submit"/></td>
</tr>
</table>
</fieldset>
</form>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5规范</title>
</head>
<body>
<input id="myCar" list="food">
<datalist id="food">
<option>baidu</option>
<option>meituan</option>
<option>eleme</option>
</datalist>
<br>
<mark>mark标签</mark>
<br>
<div style="width: 120px;height: 200px;border: 1px solid red">
<!--wbr标签为不换行 -->
11<wbr>111111<wbr>11111111111111111111111111111111111111
</div>
<!--progress标签显示为一个进度条，-->
<p>下载进度：</p>
<br>
<progress value="80" max="100"></progress>
<br>
<progress></progress>
<br>
<p>显示度量值：</p>
<!--meter标签 显示测量值-->
<meter value="9" min="2" max="10">3/10</meter>
<br>
<meter value="0.6">60%</meter>
<br>
<!--<details> 标签用于描述文档或文档某个部分的细节。可以折叠起来P标签里面的内容-->
<details>
<summary>Copyright 2011.</summary>
<p>All pages and graphics on this web site are the property of W3School.</p>
</details>
<div>2121212</div>
</body>
</html>
<!--补充
1 在html中有一些元素的属性，当只写属性名称而不指定属性值时，表求属性值为true, 如果设置该属性值为false，则不使用该属性即可。另外，要想将属性值设定true时，也可以将属性名设定为属性值， 或将空字符串设定为属性值。例如input元素中的disabled与readonly就是这样的属性。
2 没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
3 另外 ，html5在指定属性值时做了一些改进，在属性值不包括“<”、">"、"="、单引号、双引号等字符时，属性值两边的引号可以省去
4 注意的是如果省略全部标记 但是元素还是存在的
(1)空元素语法的元素：area、base、br、col、command、embed、hr、img、input、keygen、link、mata、param、source、wbr
(2)可以省略结束标签的元素：colgroup、dt、dd、li、optgroup、p、rt、rp、thread、tbody、tfoot、tr、td、th
(3)可以全部省略标签的元素：html、head、body、tbody
空元素定义，摘自W3C
没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
<br> 就是没有关闭标签的空元素（<br> 标签定义换行）。-->
<!--查询h5标签，HTML+名称-->
1480
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
