3-5table标签,认识网页上的表格

摘抄自:http://www.imooc.com/code/292
有时候我们需要在网页上展示一些数据,如某公司想在网页上展示公司的库存清单。如下表:

3-5table标签,认识网页上的表格_第1张图片

想在网页上展示上述表格效果可以使用以下代码:
3-5table标签,认识网页上的表格_第2张图片

创建表格的四个元素:
table、tbody、tr、th、td
1、…
:整个表格以
标记开始、

标记结束。
2、…:当表格内容非常多时,表格会下载一点显示一点,但如果加上标签后,这个表格就要等表格内容全部下载完才会显示。
3、…:表格的一行,所以有几对tr 表格就有几行。
4、…:表格的一个单元格,一行中包含几对...
,说明一行中就有几列。
5、…:表格的头部的一个单元格, 表格表头。
6、表格中列的个数,取决于一行中数据单元格的个数。
上述代码在浏览器中显示的默认的样式为:
3-5table标签,认识网页上的表格_第3张图片

总结:
1、table表格在没有添加css样式之前,在浏览器中显示是没有表格线的
2、表头,也就是th标签中的文本默认为 粗体并且 居中显示

你可能感兴趣的:(3-5table标签,认识网页上的表格)