实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>20180316表格实战</title> </head> <body> <h2 style="color:red">听课前的制表水平：</h2> <img src="/tkq.jpg" alt="听课前的表格水平"> <h2 style="color:lightblue">听课后的制表水平：</h2> <table border="1" cellspacing="0" cellpadding="1" align="center" width="80%"> <caption><h3>自动化-弱电-视频监控<small><a href="">添加</a></small></h3></caption> <colgroup span="1" bgcolor="lightgreen"></colgroup> <colgroup span="5" bgcolor="lightyellow"> <col> <col> <col> <col bgcolor="red"> <col> </colgroup> <colgroup span="1" bgcolor="lightgrey"></colgroup> <thead> <tr bgcolor="skeyblue"><!--这里是我敲错了，得到了近似颜色，也不错--> <th colspan="2">信息</th> <th colspan="5">内容</th> <th colspan="2" rowspan="2">操作</th> </tr> <tr bgcolor="skyblue"> <th>序号</th> <th>名称</th> <th>厂家</th> <th>规格型号</th> <th>推荐指数</th> <th>价格(元)</th> <th>备注</th> </tr> </thead> <tbody> <tr align="center"> <td>1</td> <td align="left"><img src="../image/1.jpg" width="30" alt="图1"> 摄像头</td> <td>萤石</td> <td>C2C</td> <td>☆☆☆☆☆</td> <td>188</td> <td>看家神器</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>2</td> <td align="left"><img src="../image/2.jpg" width="30" alt="图2">硬盘录像机</td> <td>海康威视</td> <td>DS-7604-K1</td> <td>☆☆☆☆☆</td> <td>695</td> <td>H.264</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>3</td> <td align="left"><img src="../image/3.jpg" width="30" alt="图3">硬盘</td> <td>西部数据</td> <td>WD30PURX</td> <td>☆☆☆☆</td> <td>788</td> <td>装在硬盘录像机里-保修3年</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>4</td> <td align="left"><img src="../image/4.jpg" width="30" alt="图4">网关</td> <td>萤石</td> <td>A1C</td> <td>☆☆☆</td> <td>188</td> <td>与萤石摄像头配合使用</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>5</td> <td align="left"><img src="../image/5.jpg" width="30" alt="图5">手动按钮</td> <td>萤石</td> <td>T3</td> <td>☆</td> <td>88</td> <td>家中老人必备</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> </tbody> <tfoot> <tr> <td colspan="5" align="left">合计</td> <td align="center">1947</td> <td></td> <td colspan="2"></td> </tr> </tfoot> </table> <p align="center"> <a href="">首页</a> <a href="">上一页</a> <a href="">1</a> <a href="">2</a> <a href="">3</a> <a href="">...</a> <a href="">下一页</a> <a href="">尾页</a> </p> </body> </html> 运行实例 » 点击 "运行实例" 按钮查看在线实例
