html中制作常用的表格-01

       在实际工作中,大家最为常用的就是统计表,统计表一半包括表头、标题、内容、备注,其中标题只能出现在第一行,并且不能重复出现,在我们使用的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这个属性用来合并指定的单元格数量。


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

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值