为什么要把这两个标签放在一起讲？
个人认为div标签可以算是一个万能标签，它可以通过CSS（层叠样式表）来模仿表格的形式来生成一个表格。那么很多人可能会疑惑那在开发的时候，到底是用div+css的形式实现一个表格组件，还是通过table实现一个表格。
个人觉得div实现的表格不具有语义化，不利于做seo（即搜索引擎优化技术，一句话就解释就是你的seo搞的好，那么网站容易被百度，谷歌等的搜索引擎查询到，这对于产品的推广可是个不小的影响。），因此你可以这么想，如果你做的是OA系统（办公自动化系统），或者ERP（人力资源管理系统）这种对seo要求不高的，果断选择div的形式吧。如果你做的是网站，需要和搜索引擎打交道，那么还是用tabel这种具有语义化的标签实现你的表格数据展示。
接下来让我们看看，如何使用table标签：
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> </head> <body> <!--table标签用来在界面上创建一个表格元素，而border属性表示表格的边框大小--> <table border="1"> <!--tr标签用来表示表格中的行--> <tr> <!--th标签用来表示表格头部--> <th>姓名</th> <th>民族</th> </tr> <tr> <!--td标签用来表示表格头部--> <td>张三丰</td> <td>230</td> </tr> </table> </body> </html>
上面给出了一个table的简单应用，可以看看浏览器上的运行效果：
效果如图所示，看起来很丑，那么我们需要通过css让它变得炫酷起来（我避免在将html中讲解css及js的知识，所以你只需要关注如何通过标签展示你想要的数据即可，不要关注美丑问题！）
如何使用div标签？
div标签就相当于一个容器一样，可以展示你想要展示的数据，同样可以通过div标签的多层嵌套实现更复杂的界面结构（通常不建议将div嵌套的层数超过三层），我们当前的页面开发基本都是基于div+css来进行布局，然后做数据展示的，所以会使用div显得尤为重要。