笔记 - 2、HTML - 表格

HTML·表格:用<table>标记声明一个表格(***)

<tr>标记:表示表格的行,嵌套在<table></table>中。
<td></td>:表示表格的单元格,嵌套在<tr></tr>中。
<caption></caption>:表格的标题,写在表格的内部,与<tr></tr>同级。

table的属性:
    border:表示表格的边框
    width:表示表格的宽度,可用像素值表示,也可用百分比来表示。
    height:表示表格的高度。只能以像素值表示,不能以百分比表示。
    align:表格的对齐方式left,center,right,默认是left。
    bordercolor:表示表格边框的颜色,只表示整个表格外边框的颜色。
    cellspacing:表示单元格与单元格之间的距离
    cellpadding:单元格中的内容与单元格边框的距离。
    bgcolor:表格的背景颜色。
    background:整个表格的背景图片。

tr的属性:
    height:设置当前行的高度,如果是你设置的高度比单元格中的内容的高度还要小的话,浏览器默认是内容有多高,这行就有多高。
    bordercolor:当前行单元格的边框颜色。只对一行起作用。
    bgcolor:表示当前行的背景颜色。会覆盖掉在table中设置的背景颜色。
    background:表示背景图片,但是现在的浏览器不支持该属性。
    align:当前行的每个单元格的水平对齐方式,left(默认),center,right
    valign:当前行的每个单元格的垂直对齐方式,top(顶部),middle(中间,默认的),bottom(底部)

td的属性:
    align:单元格中的内容的对齐方式left,center,right,默认是left。
    valign:当前单元格的垂直对齐方式,top(顶部),middle(中间,默认的),bottom(底部)
    colspan:(****)
        合并单元格,横向合并,注意:合并后要将被合并的单元格删除。
    rowspan:(****)
        合并单元格,纵向合并,注意:同上↑。
    bordercolor:表示当前单元格的边框颜色,只对一个单元格起作用。
    width:表示当前单元格所在的列的所有单元格的宽度。
    height:表示当前单元格所在行的所有单元格的高度。
    bgcolor:表示当前单元格的背景颜色。会覆盖在tr或table中设置的背景颜色。
    background:表示当前单元格的背景图片。会覆盖掉在table中设置的背景图片。
    bordercolorlight:表示单元格的亮边框颜色(单元格右边框和下边框的颜色)。
    bordercolordark:表示单元格暗边框的颜色(单元格左边框和上边框的颜色)。

<th></th>:(**)
    通常用来写在表格的首行,作为表头。
    与<td>一样,<td>有什么属性,<th>就有什么属性,写在<tr></tr>中,表示一个单元格,但是<th>有默认的样式,字体加粗,文本居中。

总结表格共有属性:height,align,bordercolor,background。。。


表格的结构:(**)
    用三对标签来实现表格的结构:<thead></thead>,<tbody></tbody>,<tfoot></tfoot>
    其中在一个表格中<tbody></tbody>可以有多个,thead和tfoot只有一个。(*)
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值