Table和Div

一、Table

Table它是定义一个表格，表格的组成部分分别是标题、表头、主体、表位。
标题：Caption定义表格的标题

<caption>新员工入职登记</caption>

表头：Thead定义表格的表头

<thead>
		<tr>
			<th>姓名</th>
			<th>性别</th>
			<th>出生日期</th>
		</tr>
	</thead>

做完后发现边框太厚了像素太低了，表格之间的间距也太宽了，这时候我们的border，cellspacing和cellpadding就派上用场了
border，cellspacing和cellpadding

		<table border="1" cellspacing="0" cellpadding="10" align="center">

主体：Tbody定义表格的主体（数据）部分

<tbody>
				<tr>
			<td>姓名</td>
			<td><br></td>
			<td>性别</td>
			<td></td>
			<td>出生日期</td>
			<td></td>
			
			</tr>
			<tr>
				<td>曾用名</td>
				<td></td>
				<td>体重</td>
				<td></td>
				<td>身高</td>
				<td></td>
			</tr>
				<tr>
				<td>民族</td>
				<td></td>
				<td>籍贯</td>
				<td></td>
				<td>婚姻状况</td>
				<td></td>
			</tr>
			<tr>
				<td>政治面貌</td>
				<td></td>
				<td>健康状况</td>
				<td></td>
				<td>血型</td>
				<td>
		</td>
			</tr>

		</tbody>

尾部：Tfoot定义尾部，亚版来显示汇总信息（一般不会用Tfoot，用Tbody）

<tfoot>
				<td>身份证号码</td>
				<td></td>
			</tfoot>

其中Tr是用来定义一行，Td是定义数据项（单元格里的），Th一般用于表头有加粗样式，Td一般用于主体部分，没有加粗的样式。

那很多人会问了，表格尾部想要合并单元格怎么办呢，这就要用到我们的colson和rowspan了

colspan是列的合并，rowspan是行的合并
例如：
colspan

<tr>
				<td>身份证号码</td>
				<td colspan="5"></td>
		</tr>

rowspan

<td rowspan="5">一寸近照</td>

二、 Div

Div定义一个块（division）
特点：在新的一行显示 块级标签

块级标签和行内标签的区别：
块级标签占满行 行内标签会按照顺序从左到右依次排列

块级标签：h1-h6、p、ul、ol、li、div、table、dl、form

行内标签： span、a、br、lable、I、em

块级元素的特点：display:block

1. 每个块都是从新的一行开始，后面的元素会另起一行（霸道）
2. 元素的宽度，高度，行高，内外边距都可以设置
3. 如果不设置元素的宽度，是它父容器的100%，除非你给他设置高度

行内元素的特点：display：inline

1. 和其他元素都在一行上
2. 不能设置元素的宽度，高度，行高，内外边距
3. 元素的宽度是它包含文字或图片的宽度，不能改变

行内块元素的特点：display：inline-block

1. 和其他元素都可以在一行上
2. 元素的宽度，高度，行高，内外边距都可以设置