XHTML、表单、HTML5、图形、媒体、API
XHTML
一、简介
1.什么是XHTML?
(1)XHTML 是以 XML 格式编写的 HTML
(2)XHTML 指的是可扩展超文本标记语言
(3)XHTML 与 HTML 4.01 几乎是相同的，XHTML 是更严格更纯净的 HTML 版本
(4)XHTML 得到所有主流浏览器的支持
2.为什么使用XHTML？
XML 是一种必须正确标记且格式良好的标记语言,XML与HTML结合为XHTML，使得HTML的代码格式更加规范
3.XHTML与HTML的区别
(1)文档结构：
XHTMLDOCTYPE 是强制性的
<html>中的 XMLnamespace 属性是强制性的
<html>、<head>、<title> 以及 <body> 也是强制性的
(2)元素语法：
XHTML 元素必须正确嵌套
XHTML 元素必须始终关闭
XHTML 元素必须小写
XHTML 文档必须有一个根元素
(3)属性语法：
XHTML 属性必须使用小写
XHTML 属性值必须用引号包围
XHTML 属性最小化也是禁止的
4.文档结构的三个强制要求
XHTML 文档必须进行 XHTML 文档类型声明，<html>、<head>、<title> 以及 <body> 元素也必须存在，并且必须使用 <html> 中的 xmlns 属性为文档规定 xml 命名空间。下面的例子展示了带有最少的必需标签的 XHTML 文档：
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title of document</title>
</head>
<body>
...
</body>
</html>
5.如何从HTML转换为XHTML
(1)向每张页面的第一行添加 XHTML <!DOCTYPE>
(2)向每张页面的 html 元素添加 xmlns 属性
(3)把所有元素名改为小写
(4)关闭所有空元素
(5)把所有属性名改为小写
(6)为所有属性值加引号
二、XHTML元素
1.XHTML元素语法规则
(1)XHTML 元素必须正确嵌套
(2)XHTML 元素必须始终关闭
(3)XHTML 元素必须小写
(4)XHTML 文档必须有一个根元素
2.XHTML 元素必须正确嵌套
在 HTML 中，某些元素可以不正确地彼此嵌套在一起，就像这样：
<b><i>Thistext is bold and italic</b></i>
在 XHTML 中，所有元素必须正确地彼此嵌套，就像这样：
<b><i>Thistext is bold and italic</i></b>
3.XHTML元素必须始终关闭
这是错误的：
<p>This is aparagraph
<p>This isanother paragraph
这是正确的：
<p>This is aparagraph</p>
<p>This isanother paragraph</p>
4.空元素也必须关闭
这是错误的：
A break:<br>
A horizontal rule:<hr>
An image: <imgsrc="happy.gif" alt="Happy face">
这是正确的：
A break: <br/>
A horizontal rule:<hr />
An image: <imgsrc="happy.gif" alt="Happy face" />
5.XHTML 元素必须小写
这是错误的：
<BODY>
<P>This is aparagraph</P>
</BODY>
这是正确的：
<body>
<p>This is aparagraph</p>
</body>
三、XHTML属性
1.XHTML属性语法规则
(1)XHTML 属性必须使用小写
(2)XHTML 属性值必须用引号包围
(3)XHTML 属性最小化也是禁止的
2.XHTML 属性必须使用小写
这是错误的：
<table WIDTH="100%">这是正确的：
<table width="100%">3. XHTML 属性值必须用引号包围
这是错误的：
<tablewidth=100%>
这是正确的：
<tablewidth="100%">
4.禁止属性简写
这是错误的：
<inputchecked>
<inputreadonly>
<inputdisabled>
<optionselected>
这是正确的：
<inputchecked="checked" />
<inputreadonly="readonly" />
<inputdisabled="disabled" />
<optionselected="selected" />
HTML 表单
一、HTML表单
1.什么是HTML表单？
HTML 表单用于搜集不同类型的用户输入
2. <form> 元素及其属性
(1)<form> 元素定义 HTML 表单
<form>
.
form elements
.
</form>
(2)<form>的属性：
<formaction="action_page.php" method="GET"target="_blank" accept-charset="UTF-8"
ectype="application/x-www-form-urlencoded"autocomplete="off" novalidate>
.
form elements
.
</form>
属性 | 描述 |
accept-charset | 规定在被提交表单中使用的字符集（默认：页面字符集）。 |
action | 规定向何处提交表单的地址（URL）（提交页面）。 |
autocomplete | 规定浏览器应该自动完成表单（默认：开启）。 |
enctype | 规定被提交数据的编码（默认：url-encoded）。 |
method | 规定在提交表单时所用的 HTTP 方法（默认：GET）。 |
name | 规定识别表单的名称（对于 DOM 使用：document.forms.name）。 |
novalidate | 规定浏览器不验证表单。 |
target | 规定 action 属性中地址的目标（默认：_self）。 |
类型 | 描述 |
text | 定义常规文本输入 |
radio | 定义单选按钮输入（选择多个选择之一） |
submit | 定义提交按钮（提交表单） |
5. 文本输入
<inputtype="text"> 定义用于文本输入的单行输入字段：
<!DOCTYPEhtml>
<html>
<body>
<form>
Firstname:<br>
<inputtype="text" name="firstname">
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
<p>请注意表单本身是不可见的。</p>
<p>同时请注意文本字段的默认宽度是 20 个字符。</p>
</body>
</html>
6. 单选按钮输入
<inputtype="radio"> 定义单选按钮：
<!DOCTYPEhtml>
<html>
<body>
<form>
<inputtype="radio" name="sex" value="male"checked>Male
<br>
<inputtype="radio" name="sex" value="female">Female
</form>
</body>
</html>
7. 提交按钮
<!DOCTYPEhtml>
<html>
<body>
<formaction="/demo/demo_form.asp">
Firstname:<br>
<inputtype="text" name="firstname" value="Mickey">
<br>
Lastname:<br>
<inputtype="text" name="lastname" value="Mouse">
<br><br>
<inputtype="submit" value="Submit">
</form>
<p>如果您点击提交，表单数据会被发送到名为 demo_form.asp 的页面。</p>
</body>
</html>
8.form元素的action属性
action 属性定义在提交表单时执行的动作，向服务器提交表单的通常做法是使用提交按钮。通常，表单会被提交到 web 服务器上的网页。在上面的例子中，指定了某个服务器脚本来处理被提交表单：
<formaction="action_page.php">
如果省略 action 属性，则 action 会被设置为当前页面
9.form的method属性
method 属性规定在提交表单时所用的 HTTP 方法（GET 或 POST）：
<formaction="action_page.php" method="GET">
或：
<formaction="action_page.php" method="POST">
(1) 何时使用 GET？
如果表单提交是被动的（比如搜索引擎查询），并且没有敏感信息，当您使用 GET 时，表单数据在页面地址栏中是可见的
注释：GET 最适合少量数据的提交。浏览器会设定容量限制
(2) 何时使用 POST？
如果表单正在更新数据，或者包含敏感信息（例如密码），POST 的安全性更加，因为在页面地址栏中被提交的数据是不可见的
10.name属性
如果要正确地被提交，每个输入字段必须设置一个 name 属性。本例只会提交 "Last name" 输入字段：
<formaction="/demo/demo_form.asp">
Firstname:<br>
<inputtype="text" value="Mickey">
<br>
Lastname:<br>
<inputtype="text" name="lastname"value="Mouse">
<br><br>
<inputtype="submit" value="Submit">
</form>
11. 用<fieldset> 组合表单数据
<fieldset>元素组合表单中的相关数据，<legend>元素为 <fieldset> 元素定义标题：
<!DOCTYPEhtml>
<html>
<body>
<formaction="/demo/demo_form.asp">
<fieldset>
<legend>Personalinformation:</legend>
Firstname:<br>
<inputtype="text" name="firstname" value="Mickey">
<br>
Lastname:<br>
<inputtype="text" name="lastname" value="Mouse">
<br><br>
<inputtype="submit" value="Submit">
</fieldset>
</form>
</body>
</html>二、HTML表单元素
1.<input>元素
<select>元素定义下拉列表：
<!DOCTYPEhtml>
<html>
<body>
<formaction="/demo/demo_form.asp">
<selectname="cars">
<optionvalue="volvo">Volvo</option>
<optionvalue="saab">Saab</option>
<optionvalue="fiat">Fiat</option>
<optionvalue="audi">Audi</option>
</select>
<br><br>
<inputtype="submit">
</form>
</body>
<option>元素定义待选择的选项，列表通常会把首个选项显示为被选选项。您能够通过添加 selected 属性来定义预定义选项
<!DOCTYPEhtml>
<html>
<body>
<p>您可以通过 selected 属性预选择某些选项。</p>
<formaction="/demo/demo_form.asp">
<selectname="cars">
<optionvalue="volvo">Volvo</option>
<optionvalue="saab">Saab</option>
<optionvalue="fiat" selected>Fiat</option>
<optionvalue="audi">Audi</option>
</select>
<br><br>
<inputtype="submit">
</form>
</body>
3. <textarea> 元素
<textarea>元素定义多行输入字段（文本域）：
<textareaname="message" rows="10" cols="30">
The cat wasplaying in the garden.
</textarea>
4.<button> 元素
<button> 元素定义可点击的按钮：
5.HTML5表单元素
HTML5 增加了如下表单元素：
<datalist>
<******>
<output>
6. HTML5<datalist> 元素
<datalist>元素为<input>元素规定预定义选项列表，用户会在他们输入数据时看到预定义选项的下拉列表，<input>元素的 list 属性必须引用<datalist> 元素的 id 属性
<formaction="/demo/demo_form.asp">
<input list="browsers" name="browser">
<datalistid="browsers">
<option value="InternetExplorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<inputtype="submit">
三、HTML 输入类型
1.text类型
<inputtype="text"> 定义供文本输入的单行输入字段：
<formaction="/demo/demo_form.asp">
Firstname:<br>
<inputtype="text" name="firstname">
<br>
Lastname:<br>
<inputtype="text" name="lastname">
<br><br>
<inputtype="submit">
</form>
2.password类型
<inputtype="password"> 定义密码字段：
<formaction="">
Username:<br>
<inputtype="text" name="userid">
<br>
Userpassword:<br>
<inputtype="password" name="psw">
</form>
3.submit类型
<inputtype="submit"> 定义提交表单数据至表单处理程序的按钮，表单处理程序（form-handler）通常是包含处理输入数据的脚本的服务器页面，在表单的 action 属性中规定表单处理程序：
<formaction="/demo/demo_form.asp">
Firstname:<br>
<input type="text"name="firstname" value="Mickey">
<br>
Lastname:<br>
<inputtype="text" name="lastname" value="Mouse">
<br><br>
<inputtype="submit" value="Submit">
</form>
如果您省略了提交按钮的 value 属性，那么该按钮将获得默认文本：
<formaction="/demo/demo_form.asp">
Firstname:<br>
<inputtype="text" name="firstname" value="Mickey">
<br>
Lastname:<br>
<inputtype="text" name="lastname" value="Mouse">
<br><br>
<inputtype="submit">
</form>
4.radio类型
<inputtype="radio"> 定义单选按钮：
<formaction="/demo/demo_form.asp">
<inputtype="radio" name="sex" value="male"checked>Male
<br>
<inputtype="radio" name="sex" value="female">Female
<br><br>
<inputtype="submit">
</form>
5.checkbox类型
<inputtype="checkbox"> 定义复选框，复选框允许用户在有限数量的选项中选择零个或多个选项：
<formaction="/demo/demo_form.asp">
<inputtype="checkbox" name="vehicle" value="Bike">Ihave a bike
<br>
<inputtype="checkbox" name="vehicle" value="Car">Ihave a car
<br><br>
<inputtype="submit">
</form>
6.button类型
<inputtype="button> 定义按钮：
<buttontype="button" onclick="alert('Hello World!')">ClickMe!</button>
7.HTML5输入类型
HTML5增加了多个输入类型：
color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week
8.number类型
<inputtype="number"> 用于应该包含数字值的输入字段。您能够对数字做出限制。根据浏览器支持，限制可应用到输入字段
<p>
根据浏览器支持：<br>
数值约束会应用到输入字段中。
</p>
<formaction="/demo/demo_form.asp">
数量（1 到 5 之间）：
<input type="number"name="quantity" min="1" max="5">
<input type="submit">
</form>
<p><b>注释：</b>IE9 及早期版本不支持 type="number"。</p>
属性 | 描述 |
disabled | 规定输入字段应该被禁用。 |
max | 规定输入字段的最大值。 |
maxlength | 规定输入字段的最大字符数。 |
min | 规定输入字段的最小值。 |
pattern | 规定通过其检查输入值的正则表达式。 |
readonly | 规定输入字段为只读（无法修改）。 |
required | 规定输入字段是必需的（必需填写）。 |
size | 规定输入字段的宽度（以字符计）。 |
step | 规定输入字段的合法数字间隔。 |
value | 规定输入字段的默认值。 |
例：
<formaction="action_page.php">
Quantity:
<input type="number"name="points"
min="0" max="100"step="10" value="30">
<input type="submit">
</form>
10.data类型
<inputtype="date"> 用于应该包含日期的输入字段。根据浏览器支持，日期选择器会出现输入字段中
<p>
根据浏览器支持：<br>
当您填写输入字段时会弹出日期选择器。
</p>
<formaction="/demo/demo_form.asp">
生日：
<input type="date" name="bday">
<input type="submit">
</form>
<p><b>注释：</b>Firefox 或者
Internet Explorer11 以及更早版本不支持type="date"。</p>
您可以向输入添加限制：
<formaction="/demo/demo_form.asp">
请输入1980-01-01 之前的日期：<br>
<inputtype="date" name="bday" max="1979-12-31"><br><br>
请输入 2000-01-01之后的日期：<br>
<inputtype="date" name="bday" min="2000-01-02"><br><br>
<inputtype="submit">
</form>
11.color类型
<inputtype="color"> 用于应该包含颜色的输入字段。根据浏览器支持，颜色选择器会出现输入字段中
<formaction="action_page.php">
Select your favorite color:
<input type="color" name="favcolor"value="#ff0000">
<input type="submit">
</form>
12.range类型
<inputtype="range"> 用于应该包含一定范围内的值的输入字段。根据浏览器支持，输入字段能够显示为滑块控件：
<html>
<body>
<p>
根据浏览器支持：<br>
输入类型"range" 可显示为滑动控件。
</p>
<formaction="/demo/demo_form.asp" method="get">
Points:
<input type="range"name="points" min="0" max="10">
<input type="submit">
</form>
<p><b>注释：</b>IE9 及早期版本不支持 type="range"。</p>
</body>
</html>
13.month类型
<inputtype="month"> 允许用户选择月份和年份。根据浏览器支持，日期选择器会出现输入字段中：
<html>
<body>
<p>
根据浏览器支持：<br>
当您填写输入字段时会弹出日期选择器。
</p>
<formaction="/demo/demo_form.asp">
生日（月和年）：
<input type="month"name="bdaymonth">
<input type="submit">
</form>
<p><b>注释：</b>Firefox 或者
Internet Explorer11 以及更早版本不支持type="month"。</p>
</body>
</html>
14.week类型
<inputtype="week"> 允许用户选择周和年。根据浏览器支持，日期选择器会出现输入字段中
<formaction="action_page.php">
Select a week:
<input type="week"name="year_week">
<input type="submit">
</form>
15. datetime-local
<inputtype="datetime-local"> 允许用户选择日期和时间（无时区）。根据浏览器支持，日期选择器会出现输入字段中：
<p>
根据浏览器支持：<br>
当您填写输入字段时会弹出日期选择器。
</p>
<formaction="/demo/demo_form.asp">
生日（日期和时间）：
<inputtype="datetime-local" name="bdaytime">
<input type="submit"value="Send">
</form>
<p><b>注释：</b>Firefox 或者
Internet Explorer 不支持 type="datetime-local"。</p>
16.email类型
<inputtype="email"> 用于应该包含电子邮件地址的输入字段。根据浏览器支持，能够在被提交时自动对电子邮件地址进行验证。某些智能手机会识别 email 类型，并在键盘增加 ".com" 以匹配电子邮件输入
17.search类型
<inputtype="search"> 用于搜索字段（搜索字段的表现类似常规文本字段）
<formaction="/demo/demo_form.asp">
搜索谷歌：
<input type="search"name="googlesearch">
<input type="submit">
</form>
18.tel类型
<inputtype="tel"> 用于应该包含电话号码的输入字段。目前只有 Safari 8 支持 tel 类型
<formaction="action_page.php">
Telephone:
<input type="tel"name="usrtel">
<input type="submit">
</form>
19.url类型
<inputtype="url"> 用于应该包含 URL 地址的输入字段。根据浏览器支持，在提交时能够自动验证 url 字段。某些智能手机识别 url 类型，并向键盘添加 ".com" 以匹配 url 输入
<formaction="action_page.php">
请添加您的首页：
<input type="url"name="homepage">
<input type="submit">
1.value属性
value 属性规定输入字段的初始值：
<formaction="">
First name:<br>
<inputtype="text" name="firstname" value="John">
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
2. readonly 属性
readonly属性规定输入字段为只读（不能修改）：
<formaction="">
Firstname:<br>
<inputtype="text" name="firstname" value ="John" readonly>
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
readonly属性不需要值。它等同于readonly="readonly"
3.disabled属性
disabled属性规定输入字段是禁用的。被禁用的元素是不可用和不可点击的。被禁用的元素不会被提交
<formaction="">
Firstname:<br>
<inputtype="text" name="firstname" value ="John" disabled>
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
disabled属性不需要值。它等同于disabled="disabled"
4. size属性
size 属性规定输入字段的尺寸（以字符计）：
<formaction="">
Firstname:<br>
<inputtype="text" name="firstname" value ="John" size="40">
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
5. maxlength 属性
maxlength属性规定输入字段允许的最大长度：
<formaction="">
Firstname:<br>
<inputtype="text" name="firstname" maxlength="10">
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
如设置 maxlength 属性，则输入控件不会接受超过所允许数的字符。该属性不会提供任何反馈。如果需要提醒用户，则必须编写 JavaScript 代码
6. HTML5 属性
HTML5 为 <input> 增加了如下属性：
autocomplete、autofocus、form、formaction、formenctype、formmethod、formnovalidate、formtarget、height、width、list、min、max、multiple、pattern (regexp)、placeholder、required、step
并为<form> 增加如需属性：
autocomplete
novalidate
7. autocomplete 属性（<form>）
autocomplete属性规定表单或输入字段是否应该自动完成。当自动完成开启，浏览器会基于用户之前的输入值自动填写值，autocomplete 属性适用于 <form> 以及如下 <input> 类型：text、search、url、tel、email、password、datepickers、range 以及color
提示：您可以把表单的autocomplete 设置为 on，同时把特定的输入字段设置为 off，反之亦然。
<form action="/example/html5/demo_form.asp"method="get" autocomplete="on">
Firstname:<input type="text" name="fname" /><br />
Last name:<input type="text" name="lname" /><br />
E-mail: <inputtype="email" name="email" autocomplete="off"/><br />
<inputtype="submit" />
</form>
<p>填写并提交表单，然后重新加载该页面，看看自动完成功能是如何工作的。</p>
<p>注意，表单的自动完成功能是打开的，但是 e-mail 字段的自动完成功能是关闭的。</p>
novalidate 属性属于 <form> 属性。如果设置，则 novalidate 规定在提交表单时不对表单数据进行验证
<formaction="/example/html5/demo_form.asp" method="get" novalidate="novalidate">
E-mail: <inputtype="email" name="user_email" />
<inputtype="submit" />
</form>
若不设置，则：
autofocus属性是布尔属性。如果设置，则规定当页面加载时 <input> 元素应该自动获得焦点
<form action="demo_form.asp">
First name: <input type="text"name="fname" autofocus><br>
Last name: <input type="text"name="lname"><br>
<input type="submit">
</form>
10. form 属性
form 属性规定 <input> 元素所属的一个或多个表单
提示：如需引用一个以上的表单，请使用空格分隔的表单 id 列表
<formaction="/example/html5/demo_form.asp" method="get"id="form1">
First name:<input type="text" name="fname" /><br />
<inputtype="submit" value="提交" />
</form>
<p>下面的 "Last name" 字段位于 form 元素之外，但仍然是表单的一部分。</p>
Last name:<input type="text" name="lname" form="form1"/>
11. formaction 属性
formaction属性规定当提交表单时处理该输入控件的文件的 URL。formaction属性覆盖 <form> 元素的 action 属性。formaction 属性适用于 type="submit" 以及 type="image"
<formaction="/example/html5/demo_form.asp" method="get">
First name:<input type="text" name="fname" /><br />
Last name:<input type="text" name="lname" /><br />
<inputtype="submit" value="提交" /><br />
<inputtype="submit" formaction="/example/html5/demo_admin.asp"value="以管理员身份提交"/>
</form>
formenctype属性规定当把表单数据（form-data）提交至服务器时如何对其进行编码（仅针对 method="post" 的表单）。formenctype 属性覆盖 <form>元素的 enctype 属性。formenctype 属性适用于 type="submit" 以及 type="image"
<formaction="/example/html5/demo_post_enctype.asp"method="post">
First name: <input type="text"name="fname" /><br />
<inputtype="submit" value="提交" />
<inputtype="submit" formenctype="multipart/form-data"value="以Multipart/form-data 编码提交" />
</form>
13. formmethod 属性
formmethod属性定义用以向 actionURL 发送表单数据（form-data）的 HTTP 方法。formmethod 属性覆盖 <form> 元素的 method 属性。formmethod 属性适用于 type="submit" 以及 type="image"
<formaction="/example/html5/demo_form.asp" method="get">
First name: <input type="text"name="fname" /><br />
Last name: <input type="text"name="lname" /><br />
<inputtype="submit" value="提交" />
<inputtype="submit" formmethod="post" formaction="/example/html5/demo_post.asp"value="使用 POST 提交" />
</form>
14. formnovalidate 属性
novalidate属性是布尔属性。如果设置，则规定在提交表单时不对 <input> 元素进行验证。formnovalidate 属性覆盖 <form> 元素的 novalidate 属性。
formnovalidate 属性可用于 type="submit"
<formaction="/example/html5/demo_form.asp" method="get">
E-mail: <inputtype="email" name="userid" /><br />
<inputtype="submit" value="提交" /><br />
<inputtype="submit" formnovalidate="formnovalidate"value="进行没有验证的提交"/>
</form>
15. formtarget 属性
formtarget属性规定的名称或关键词指示提交表单后在何处显示接收到的响应。
formtarget 属性会覆盖 <form> 元素的 target 属性。formtarget 属性可与 type="submit" 和 type="image"使用
<formaction="/example/html5/demo_form.asp" method="get">
First name: <input type="text"name="fname" /><br />
Last name: <input type="text"name="lname" /><br />
<inputtype="submit" value="提交" />
<inputtype="submit" formtarget="_blank"value="提交到新窗口/选项卡" />
</form>
16. height 和 width 属性
height 和 width 属性规定 <input> 元素的高度和宽度。height 和 width 属性仅用于<input type="image">。请始终规定图像的尺寸，如果浏览器不清楚图像尺寸，则页面会在图像加载时闪烁
<formaction="/example/html5/demo_form.asp" method="get">
First name: <input type="text"name="fname" /><br />
Last name: <input type="text"name="lname" /><br />
<input type="image"src="/i/eg_submit.jpg" alt="Submit" width="128" height="128"/>
</form>
17. list 属性
list 属性引用的 <datalist> 元素中包含了 <input> 元素的预定义选项
<inputlist="cars" />
<datalistid="cars">
<option value="BMW">
<option value="Ford">
<option value="Volvo">
</datalist>
18. min 和 max 属性
min 和 max 属性规定 <input> 元素的最小值和最大值。min 和 max 属性适用于如需输入类型：number、range、date、datetime、datetime-local、month、time 以及 week
<formaction="/example/html5/demo_form.asp" method="get">
Points: <inputtype="number" name="points" min="0"max="10" />
<inputtype="submit" />
</form>
19. multiple 属性
multiple属性是布尔属性。如果设置，则规定允许用户在 <input> 元素中输入一个以上的值。multiple 属性适用于以下输入类型：email 和 file
<formaction="/example/html5/demo_form.asp" method="get">
选择图片：<inputtype="file" name="img"multiple="multiple" />
<inputtype="submit" />
</form>
placeholder属性规定用以描述输入字段预期值的提示（样本值或有关格式的简短描述）。该提示会在用户输入值之前显示在输入字段中。placeholder 属性适用于以下输入类型：text、search、url、tel、email 以及password
<formaction="/example/html5/demo_form.asp" method="get">
<inputtype="search" name="user_search" placeholder="SearchW3School" />
<inputtype="submit" />
</form>
required属性是布尔属性。如果设置，则规定在提交表单之前必须填写输入字段。
required 属性适用于以下输入类型：text、search、url、tel、email、password、datepickers、number、checkbox、radio、and file
<formaction="/example/html5/demo_form.asp" method="get">
Name: <inputtype="text" name="usr_name" required="required"/>
<inputtype="submit" value="提交" />
</form>
22. step 属性
step 属性规定 <input> 元素的合法数字间隔。示例：如果 step="3"，则合法数字应该是 -3、0、3、6、等等。
提示：step 属性可与 max 以及 min 属性一同使用，来创建合法值的范围。
step 属性适用于以下输入类型：number、range、date、datetime、datetime-local、month、time 以及 week
<formaction="/example/html5/demo_form.asp" method="get">
<inputtype="number" name="points"step="3" />
<inputtype="submit" />
</form>