常用文档内容的标签（二）

表格标签

＜table＞＜/table＞主要是展示数据，表格可以让数据展示的非常规整，可读性好。

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

＜tr＞＜/tr＞标签是用于定义表格中的行。必须嵌套在＜table＞＜/table＞中
＜td＞＜/td＞标签是用于定义单元格。必须嵌套在＜tr＞＜/tr＞中。
＜th＞＜/th＞标签是用于表头单元格，即为表格中的第一行或第一列，会将其中的文本加粗展示。必须嵌套在＜tr＞＜/tr＞中。

表格结构标签

为了方便表示可能会出现的长表格，可以将表格分为表格头部和表格主体两部分。分别用＜thead＞＜/thead＞和＜tbody＞＜/tbody＞。这样可以更清晰的分出表格结构。

<table>
  <thead>                  //表格头部
    <tr>
      <th>单元格文字</th>
      <th>单元格文字</th>
      ...
    </tr>
  </thead>
  <tbody>                 //表格主体
    <tr>
      <th>单元格文字</th>
      <td>单元格文字</td>
      ...
    </tr>
    ...
  </tbody>
</table>

合并单元格

特殊情况下，可以将多个单元格合并为一个单元格。

跨行合并：rowspan="合并的个数";
跨列合并：colspan="合并的个数";

若跨行，合并的代码写在最上面单元格里；若跨列则写在最左边的单元格里。

列表标签

列表主要是用来布局，最大的特点就是整齐有序，布局起来自由方便。可分为三类：无序列表、有序列表、自定义列表。

无序列表

＜ul＞＜/ul＞标签表示无序列表，一般会用项目符号呈现列表项，列表项则由＜li＞＜/li＞标签定义。

<ul>
  <li></li>
  <li></li>
  ...
</ul>

无序列表的各个列表项，没有序级之分，是并列的。＜li＞＜/li＞中可容纳所有元素。样式由CSS设置。

有序列表

＜ol＞＜/ol＞标签表示有序列表，其各个表项会按照一定顺序排列定义。排序以数字显示，也使用＜li＞＜/li＞定义表项。样式也由CSS设置。

<ol>
  <li></li>
  <li></li>
  ...
</ol>

自定义列表

＜dl＞＜/dl＞标签表示定义描述列表。和＜dt＞＜/dt＞与＜dd＞＜/dd＞一起使用。自定义列表常用于对术语或名词进行解释描述，表项无任何符号。

<dl>
  <dt>术语</dt>
  <dd>解释1</dd>
  <dd>解释2</dd>
  ...
</dl>

＜dl＞＜/dl＞只能包含＜dt＞＜/dt＞与＜dd＞＜/dd＞。多为一个＜dt＞＜/dt＞对应多个＜dd＞＜/dd＞

表单标签

表单的目的是为了收集用户信息，网页交互中就需要表单。一个完整的表单通常由表单域、表单元素和提示信息构成。

表单域

＜form＞＜/form＞标签用来定义表单域，以实现用户信息的收发。

<form action="url" method="提交方式" name="表单域名称"></form>
//method值get/post

表单元素

在表单域中可以定义各种表单元素，允许用户在表单中输入或者选择内容。

input

＜input＞标签用于收集用户信息。包含有type属性，其输入字段根据type拥有多种形式。

<input type="属性值"/>

属性值	说明
button	可点击按钮
checkbox	复选框
file	输入字段和浏览按钮，供文件上传
hidden	定义隐藏的输入字段
image	图像形式的提交按钮
password	密码字段，该字段会被掩码
radio	单选按钮
reset	重置按钮
submit	提交按钮
text	单行的输入字段

除了最重要的type，还有其他常用的属性。

其他常用属性	说明
name	自定义input元素名称
value	自定义input值
checked	首次加载时被选中
maxlength	规定输入字段的最大长度

select

页面中有多个选项，且需要节约页面空间，则可以使用＜select＞＜/select＞标签定义下拉列表。选项由＜option＞＜/option＞定义。

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

textarea

＜textarea＞＜/textarea＞标签定义多行文本输入的控件，需要输入较多内容的情况下使用。如评论，反馈等。通常使用CSS设置大小。

<textarea rows='行数' cols='每行中的字符数'>文本</textarea>

HTML一些常用标签（二）