html中制作常用的表格-01

来源:互联网 发布:外贸 知乎 编辑:程序博客网 时间:2024/06/09 23:26

       在实际工作中,大家最为常用的就是统计表,统计表一半包括表头、标题、内容、备注,其中标题只能出现在第一行,并且不能重复出现,在我们使用的HTML中,<table>就是用来制作表格的,其中常用的标签<thead><tbody><tfoot><th><td><tr>,用实例解析一下简单统计表的制作。


1、标题制作:<caption></caption>这个标签要紧跟在<table>之后,其中可以设置其字体大小,上下间距。

2、标题制作:标题可以使用<thead>标签,其中<thead>中可以使用<th>或<td>,<th>用来加粗标题字体,<td>没有加粗字体,其中这两个都是用来输入内容的。

3、内容制作:内容可以采用<tbody>标签,其中<tr>是行表示,<td>是列表示。

4、最后就是表尾,可以使用<tfoot>标签。

         现在我们分析一下代码方面的知识:

1、总体布局:可以将整个表格放入div中,设置div样式,然后就是table中个人单元之间的间距。其中cellspacing用来说设置单元格之间的间距,设置为0表示上下单元格合并为一,如果大于0 ,则会出现每个单元都是独立的,cellpadding用来设置每个单元格边距。


2、标题中使用<thead><th></th></table>,其中th中的文本内容会自动居中。


3、内容采用<tr><td></td></tr>,其中td中的文本可以居中展示,使用text-align:center。一个<tr></tr>表示一行,如果有多行数据,就写多个<tr></tr>标签。


4、最后就是表尾,一般是个总结性语句,或者备注之类的,其中主要的是合并单元格这个属性。其中colspan这个属性用来合并指定的单元格数量。


        此文,如有不妥当之处,请不吝惜指正!