HTML的表格，列表，表单相关整理

表格是用来显示数据，列表是用于布局，表单用于收集用户信息。

一、表格

1.表格格式

<table>
  <tr>
    <td>单元格内的文字</td>
    ...
  </tr>
  ...
</table>

2.表格属性

3.合并单元格

（横行竖列）

• 跨行合并：rowspan=“合并单元格的个数”
• 跨列合并：colspan=“合并单元格的个数”
• 可以理解为写了这条语句的行/列一共占据了多少行/列

二、列表

1.列表的概念

容器里面装载着结构，样式一致的文字或图表的一种形式，叫列表。

2.列表的分类

①无序列表

 1. <ul></ul>中只能嵌套<li></li>，不能直接在<ul></ul>标签中输入其他标签或者文字。
 2. <li>与</li>之间相当于一个可以容纳所有元素的容器。

<ul>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  ......
</ul>

②有序列表

<ol>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  ......
</ol>

③自定义列表

<dl>
  <dt>名词1</dt>
  <dd>名词1解释1</dd>
  <dd>名词1解释2</dd>
  ...
  <dt>名词2</dt>
  <dd>名词2解释1</dd>
  <dd>名词2解释2</dd>
  ...
</dl>

三、表单

在HTML中，一个完整的表单通常由表单控件（也称为表单元素）、提示信息和表单域3个部分构成。

1.input控件

<input type="属性值" value="你好">

input控件相关属性：

2.下拉列表

<select>
  <option>选项1</option>
  <option>选项2</option>
  <option>选项3</option>
  ...
</select>

3.label标签

label标签使用方式①：

<label> 用户名： <input type="radio" name="usename" value="请输入用户名">   </label>

label标签使用方式②：

根据id属性形成联系：

<label for="sex">女</label>
<input type="radio" name="sex"  id="sex">