表格標簽： <table></table>

表格標簽的作用：用來給一堆數據添加表格語義
表格標簽是一種數據的展現形式，當數據量特別大的時候，表格的展現形式很清楚。

表格標簽格式：
<table>
<tr>
<td>
</td>
</tr>
</table>

tr：表格的一行
td：表格的一行中的一個單元格

兩行三列
2tr + 3td

表格標簽邊框屬性：<table border="3"></table>
默認值為0

Paste_Image.png

Paste_Image.png

表格標簽屬性：
-寬度width和高度height ：用于 table和td，tr不能用
默認是按照內容調整，可通過 width / height 改變
<table border="1" width="500px" height="500px" >
<td width="150px" height="50px">1.1</td>

-水平對齊和垂直對齊
水平align：用于 table、td、tr
<table border="1" width="500px" height="500px" align="center"> 整個表格居中
<tr align="center"> 這一行內容居中

垂直：用于 tr、td
<tr align="bottom">

-外邊距和內邊距：只能用于table
外邊距cellspacing：單元格和單元格之間的距離
內邊距cellpadding：文字、圖片到內邊框的距離

細線表格：

Paste_Image.png

Paste_Image.png

表格中添加圖片：

Paste_Image.png

Paste_Image.png

Paste_Image.png

caption標簽：專門用來設置表格標題的標簽，要放置在 table 標簽里面，否則無效，并且要放置在 table 開始標簽后面

th 標簽：表格標簽提供的一個專門用來存儲每一列的標題的標簽，標題會自動加粗、自動居中
td存儲數據、th存儲標題

Paste_Image.png

Paste_Image.png

單元格合并：
-水平方向合并
可以給td標簽添加一個 colspan 屬性來指定把一個單元格當作多個單元格來看待，把當前單元格當作兩個單元格來看待，但是會多出一些單元格，所以就要刪除一些單元格
單元格永遠是向后、向下合并

Paste_Image.png

Paste_Image.png

-垂直方向合并 rowspan
垂直方向同理

Paste_Image.png

Paste_Image.png