这个表格是如何用HTML实现的？
2016-11-29 本文已影响21人
肆意木
<h2>题目要求：实现如下表格。<h2>
表格1.png
1.实现上面的表头
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title></head>
<body>
<p>购物车</p>
<table border="1">
<tbody>
<tr>
<th rowspan="2">名称</th>
<th colspan="2">2016-11-22</th>
<th rowspan="2">小计</th>
</tr>
<tr>
<th>重量</th>
<th>单价</th>
</tr>
</tbody>
</table>
</body>
</html>
table2.png
2.实现表格的body：
<tbody>
<tr>
<th>苹果</th>
<th>3公斤</th>
<th>5元/公斤</th>
<th>15元</th>
</tr>
<tr>
<th>香蕉</th>
<th>2公斤</th>
<th>6元/公斤</th>
<th>12元</th>
</tr>
</tbody>
table3.png
3.实现表格底部：
<tfoot>
<tr>
<th colspan="3">总价</th>
<th>27元</th>
</tr>
</tfoot>
table4.png
以上就是完成这道题的步骤。
