效果图：
代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>3月16日作业-新闻网站后台管理系统</title> </head> <body> <table border="1" cellspacing="0" cellpadding="5" width="60%"> <caption> <h2>新闻网站后台管理系统</h2><br> <p><a href="" style="color:red; font-weight: bold;">+新增文章</a></p> </caption> <tr bgcolor="#00caca"> <th>ID</td> <th>标题</td> <th>发布人</td> <th>发布时间</td> <th colspan="2">操作</th> </tr> <tr> <td> 1 </td> <td> <a href="">最大活火山-黄石公园</a> </td> <td> admin </td> <td> 2018-03-17 </td> <td> <a href=""><img src="../images/edit.png" width="30" alt="编辑"></a> </td> <td> <a href=""><img src="../images/delete.png" width="30" alt="删除"></a> </td> </tr> <tr> <td> 2 </td> <td> <a href="">美国发生校园枪击案</a> </td> <td> admin </td> <td> 2018-03-15 </td> <td> <a href=""><img src="../images/edit.png" width="30" alt="编辑"></a> </td> <td> <a href=""><img src="../images/delete.png" width="30" alt="删除"></a> </td> </tr> <tr> <td> 3 </td> <td> <a href="">XXX被曝与XX半夜幽会</a> </td> <td> admin </td> <td> 2018-03-14 </td> <td> <a href=""><img src="../images/edit.png" width="30" alt="编辑"></a> </td> <td <a href=""><img src="../images/delete.png" width="30" alt="删除"></a> </td> </tr> <tr> <td> 4 </td> <td> <a href="">小行星再次与地球擦肩而过</a> </td> <td> admin </td> <td> 2018-03-13 </td> <td> <a href=""><img src="../images/edit.png" width="30" alt="编辑"></a> </td> <td> <a href=""><img src="../images/delete.png" width="30" alt="删除"></a> </td> </tr> <tr> <td> 5 </td> <td> <a href="">魔兽世界8.0版本即将来临</a> </td> <td> admin </td> <td> 2018-03-11 </td> <td> <a href=""><img src="../images/edit.png" width="30" alt="编辑"></a> </td> <td> <a href=""><img src="../images/delete.png" width="30" alt="删除"></a> </td> </tr> </table> <table width="60%"> <tr style="line-height: 2em"> <td colspan="6" border="0"> <a href="">首页</a> <a href="">上一页</a> <a href="">1,</a> <a href="">2,</a> <a href="">...</a> <a href="">下一页</a> <a href="">尾页</a> </td> </tr> </table> </body> </html>
手写代码：
