<table>表格的基本属性
表格是最重要的数据化格式工具啦,无论是前台还是后台,都有大量的应用
我们先打几个网站看一下,页面中哪些内容是用表格做的
https://www.layuiweb.com/doc/element/table.html
创建表格的步骤：
创建一个最简单的表格
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>7-1表格的基本属性</title> </head> <body> <table> <caption>国内明星TOP50排行榜</caption> <tr> <!-- <th>标签内部文本默认会加粗居中显示,非常适合做表头 --> <th>ID</th> <th>姓名</th> <th>腰围</th> <th>腰围</th> <th>臀围</th> </tr> <tr> <td>01</td> <td>高圆圆</td> <td>88</td> <td>59</td> <td>85</td> </tr> <tr> <td>02</td> <td>赵丽颖</td> <td>90</td> <td>60</td> <td>85</td> </tr> <tr> <td>03</td> <td>迪丽热巴</td> <td>87</td> <td>61</td> <td>88</td> </tr> <tr> <td>04</td> <td>古力娜扎</td> <td>86</td> <td>62</td> <td>88</td> </tr> <tr> <td>05</td> <td>毛晓彤</td> <td>88</td> <td>68</td> <td>90</td> </tr> </table> </body> </html>
运行：
给表格添加属性，使其更好看
添加表格线 标题使用h3包裹 合并单元格之间的间隙 表格内容和边框线的距离设置为5 表格居中 宽度80% 标题行添加天蓝色的背景
参数说明：
border:设置表格边框线的宽度
cellspacing: 设置单元格之间的间隙,设置为0,相当于单元格边线折叠,这时它自动使用表格的边框宽度,如1
cellpadding: 设置单元格数据与边界之间的距离,使内容不至于太拥挤
align: 设置单元格内数据的对方方式,默认为left左对齐,可以设置right右对齐和center居中对齐
width: 设置表格的宽度,可以为绝对值,也可以是一个百分比相对值,推荐设置为相对值,以自适应数据变化
height: 设置表格的高度,这里没有设置,以适应表格的行数的变化
Top50没显示完成，添加分页：
让单元格中的文字全部居中 给所有的td都加一个属性 align=”center”即可
除了在上面这种方式还可以在每行tr上加一个居中的属性
本文作者为BUG之神，转载请注明。