完成后效果显示
代码
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>商品信息表</title> </head> <body> <table border="1" align="center" width="90%" cellspacing="0" cellpadding="5"> <caption> 6月商品采购表 </caption> <thead bgcolor="Coral"> <tr> <th>商品类别</th> <th>ID</th> <th>名称</th> <th>单价</th> <th>数量</th> <th>金额</th> </tr> </thead> <tbody> <tr> <td rowspan="2" bgcolor="LightBlue">电子产品</td> <td>1</td> <td>苹果手机</td> <td>6000</td> <td>10</td> <td>60000</td> </tr> <tr> <td>2</td> <td>三星电脑</td> <td>8000</td> <td>2</td> <td>16000</td> </tr> <tr> <td rowspan="2" bgcolor="LightPink">食品</td> <td>3</td> <td>牛肉</td> <td>80</td> <td>10</td> <td>800</td> </tr> <tr> <td>4</td> <td>鸡蛋</td> <td>2</td> <td>20</td> <td>40</td> </tr> <tr> <td rowspan="2" bgcolor="Silver">生活用品</td> <td>5</td> <td>卫生纸</td> <td>20</td> <td>6</td> <td>120</td> </tr> <tr> <td>6</td> <td>牙膏</td> <td>8</td> <td>5</td> <td>40</td> </tr> </tbody> <tfoot> <tr> <td colspan="4" bgcolor="PaleGoldenRod">合计</td> <td>53</td> <td>77000</td> </tr> </tfoot> </table> </body></html>
