table标签

table 表格 双标签 表格级 

写法

<table>

<tr>

<th></th>(th表格头)

<td></td>(单元格)

</tr>

一个table标签可以有多个tr和td标签组成

<table>表格属性

1、 属性

1、width:设置表格宽度

2、height:设置表格高度

3、align“设置 表格 在其 父元素中的水平对齐方式,取值:left,center,right

4、border:边框,边框宽度,以px为单位的数值,px可以省略

5、cellpadding:单元格内边距  单元格边框与内容之间的距离

6、cellspacing:单元格外边距  单元格与单元格之间或者单元格与表格之间的 距离

7、bgcolor:背景颜色

<tr>属性

1、align:该行的内容 水平对齐方式

2、valign:该行的内容 垂直对齐方式   取值:top,middle,bottom

3、bgcolor:背景色

<td>属性

1、width

2、height

3、align

4、valign

5、bgcolor

6、colspan:设置单元格跨列

7、rowspan:设置单元格跨行

表格的行和列不是规定死的,可以进行跨行和跨列操作   如:

跨�列:colspan="3"  数字是几,就跨几列,数字是三就是三列

跨 行:rowspan="2" 数字是二就跨两行

表格特有的样式属性

1、边框合并

属性:border-collapse

取值:

(1)、separate   :默认值,分离边框模式

(2)、collapse:边框合并模式

2、边框边距

属性:border-spacing

(1)、作用 :设置相邻单元格边框之间的距离(类似于cellspacing)

(2)、取值:

1、取1个值:表示水平和垂直间距相等

2、取2个值:第一个值表示的 水平间距

第二个值表示的 垂直间距

两个值之间用 空格 隔开

3、要求

border-collapse必须为separate

必须为分离边框模式时有效

一个简单地案例:

代码

显示结果:

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容