<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<!--為指定的id:t2設(shè)置屬性：顏色為綠色-->
<style>
#t2{color:green;}
</style>
</head>
<body>
<h3>表格練習(xí)</h3>
<!--
tr 代表一行
th 代表第一行標(biāo)題
td 代表一個(gè)單元格
border 屬性規(guī)定圍繞表格的邊框的寬度
-->
<table border="1" width="300px" height="200px">
<thead style="background:red">
<tr>
<th>序號</th>
<th>商品名稱</th>
<th>供應(yīng)商家</th>
<th>規(guī)格</th>
</tr>
</thead>
<tbody style="background:blue;">
<tr>
<td>1</td>
<td>溜溜球</td>
<td>海瀾之家</td>
<td>3塊</td>
</tr>
<tr>
<td>2</td>
<td>橡皮擦</td>
<td>警察局</td>
<td>10塊</td>
</tr>
<tr>
<td>2</td>
<td>橡皮擦</td>
<td>警察局</td>
<td>10塊</td>
</tr>
</tbody>
<tfoot style="background:yellow;">
<tr>
<td>2</td>
<td>橡皮擦</td>
<td>警察局</td>
<td>10塊</td>
</tr>
</tfoot>
</table>
<hr /> <!--增加橫線-->
<!--
# 合并單元格
colspan: 橫向合并
rowspan: 縱向合并
-->
<table border="1" width="300px" height="200px" id="t2">
<thead style="background:red">
<tr>
<th>序號</th>
<th>商品名稱</th>
<th>供應(yīng)商家</th>
<th>規(guī)格</th>
</tr>
</thead>
<tbody style="background:yellow;">
<tr>
<td colspan="2">左右合并</td>
<td>海瀾之家</td>
<td rowspan="3">上下合并</td>
</tr>
<tr>
<td>2</td>
<td>橡皮擦</td>
<td>警察局</td>
</tr>
<tr>
<td>2</td>
<td>橡皮擦</td>
<td>警察局</td>
</tr>
</tbody>
<tfoot style="background:purple;">
<tr>
<td>2</td>
<td>橡皮擦</td>
<td>警察局</td>
<td>10塊</td>
</tr>
</tfoot>
</table>
</body>
</html>
table標(biāo)簽.png
