1.表单
<form> 元素定义 HTML 表单。表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。
1.1 表单的属性
| 属性 | 值 | 功能 |
|---|---|---|
| action | URL | 规定当提交表单时向何处发送表单数据。 |
| method | get post |
规定用于发送 form-data 的 HTTP 方法。 |
| target | _blank _self _parent _top framename post |
规定在何处打开 action URL。 |
1.2 改变表单内元素类型
我们可以通过改变<input>元素的type属性的值，来改变表单内元素类型。
| 值 | 描述 |
|---|---|
| button | 定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。 |
| checkbox | 定义复选框。 |
| file | 定义输入字段和 "浏览"按钮，供文件上传。 |
| hidden | 定义隐藏的输入字段。 |
| image | 定义图像形式的提交按钮。 |
| password | 定义密码字段。该字段中的字符被掩码。 |
| radio | 定义单选按钮。 |
| reset | 定义重置按钮。重置按钮会清除表单中的所有数据。 |
| submit | 定义提交按钮。提交按钮会把表单数据发送到服务器。 |
| text | 定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。 |
| date | 定义一个可选择的日期选择列表 |
| 定义一个邮箱地址 |
1.3 例子：用户注册
现在，我们还需要一点补充知识。
1.当使用radio类型的input元素时，我们应该给同一组的radio以相同的name，以区分radio的组（checked属性用于设置默认选中的选项）。
2.在<form>标签中使用<select>标签，可以创建选择列表。可以通过<option>标签为选择列表添加选项。
代码如下：
<select>
<option selected>--请选择--</option>
<option>你是谁？</option>
<option>你爸是谁？</option>
<option>你妈是谁？</option>
</select>运行结果，如图：
但这还不够，有时我们还需要在一个选择列表中制造一种多级的效果。这时，我们就需要创建<optgroup>，给<opiton>分组。
代码如下：
地址:<select>
<option selected>--请选择--</option>
<optgroup label="吉林省">
<option value="">长春市</option>
</optgroup>
<optgroup label="黑龙江省">
<option>大庆市</option>
</optgroup>
<optgroup label="辽宁省">
<option>沈阳市</option>
</optgroup>
<optgroup label="安徽省">
<option>芜湖市</option>
</optgroup>
</select>运行结果，如图：
现在，我们已经可以做一点东西了，让我们用刚才学到的东西来写个注册页面，代码如下：
<form action="" method="post" style="text-align: center;">
<h2>用户注册</h2>
账号：<input type="text"><br>
密码：<input type="password"><br>
性别：<input type="radio" name="gender" checked/>男
<input type="radio" name="gender"/>女<br>
年龄：<input type="text"><br>
身份证：<input type="text"><br>
密码问题：<select>
<option selected>--请选择--</option>
<option>你是谁？</option>
<option>你爸是谁？</option>
<option>你妈是谁？</option>
</select><br />
密码答案：<input type="text"><br>
email地址：<input type="text"><br>
爱好：<input type="checkbox"/>抽烟
<input type="checkbox" />喝酒
<input type="checkbox" />烫头<br>
头像：<input type="file"><br>
个人简介：<input type="text"><br>
<input type="submit" value="提交"/><input type="reset" value="重置"/>
</form>运行结果，如图：
不错，不错，现在看起来，我们能做点东西了，但是现在的页面还很不整齐，所以我们还要做点修改。我们可以使用表格的方式，把页面变整齐。
代码如下：
<form action="" method="post">
<table border="1" align="center">
<tr>
<th colspan="2">用户注册</th>
</tr>
<tr>
<td><label for="account">账号:</label></td>
<td><input type="text" id="account"></td>
</tr>
<tr>
<td><label for="password">密码:</label></td>
<td><input type="password" id="password" ></td>
</tr>
<tr>
<td><label>性别：</label></td>
<td><input type="radio" name="gender" checked>男
<input type="radio" name="gender"/>女</td>
</tr>
<tr>
<td><label for="age">年龄:</label></td>
<td><input type="text" id="age"></td>
</tr>
<tr>
<td><label for="IDcard">身份证：</label></td>
<td><input type="text" id="IDcard"></td>
</tr>
<tr>
<td><label>密码问题:</label></td>
<td><select>
<option selected>--请选择--</option>
<option>你是谁？</option>
<option>你爸是谁？</option>
<option>你妈是谁？</option>
</select></td>
</tr>
<tr>
<td><label for="password_answer">密码答案:</label></td>
<td><input type="text" id="password_answer">
</td>
</tr>
<tr>
<td><label for="email">email地址：</label></td>
<td><input type="email" id="email"></td>
</tr>
<tr>
<td><label>爱好：</label></td>
<td><input type="checkbox"/>抽烟
<input type="checkbox" />喝酒
<input type="checkbox" />烫头
</td>
</tr>
<tr>
<td><label for="profile">头像：</label></td>
<td><input type="file" id="profile"> </td>
</tr>
<tr>
<td><label for="intro">个人简介：</label></td>
<td><input type="text" id="intro"></td>
</tr>
<tr align="center">
<td colspan="2">
<input type="submit" value="提交">
           
<input type="reset" value="重置">
</td>
</tr>
</table>
</form>从代码可以看出<input>可以作单标签使用。
这里因为提交和重置会贴在一起，所以需要使用转义字符 来输出空格。
运行结果，如图：
2.列表
2.1 无序列表
我们可以使用<ul> 标签(unordered list)创建无序列表，用<li>标签为其添加项，通过type属性改变标识的形状。
| disc |
| square |
| circle |
举例代码如下：
<ul type="disc">
<li>java</li>
<li>.net</li>
<li>C++</li>
</ul>效果如图：
2.2 有序列表
我们可以使用<ol> 标签创建有序列表，用<li>标签为其添加项，通过type属性改变标识的形状。type属性，例如数字，大写字母，小写字母。
举例代码如下：
<ol type="A">
<li>java</li>
<li>.net</li>
<li>C++</li>
</ol>效果如图：
2.3 定义列表
我们可以使用<dl> 标签创建定义列表（definition list），用<dt>标签为其添加组，用<dd>标签为其添加项，通过type属性改变标识的形状。
举例代码如下：
<dl>
<dt>吉林省</dt>
<dd>长春市</dd>
<dd>白城市</dd>
<dt>安徽省</dt>
<dd>芜湖市</dd>
<dd>合肥市</dd>
</dl>效果如图：
