欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

CSS控制表格tr之间的边距

程序员文章站 2022-06-21 22:29:43
css控制表格tr之间的边距 tr 之间距离可以通过设置 tr 的外边距(margin)来实现,但是注意必须先把tr的显示属性设置为块体(block)元素:...

css控制表格tr之间的边距

tr 之间距离可以通过设置 tr 的外边距(margin)来实现,但是注意必须先把tr的显示属性设置为块体(block)元素:

1

2

3

4

tr{

display:block;/*将tr设置为块体元素*/

margin:2px0;/*设置tr间距为2px*/

}

示例如下:

创建html元素

1

2

3

4

5

1 2 3
4 5 6
7 8 9

添加css样式

1

2

3

4

5

table{border-collapse:collapse;}

td{width:90px;padding:5px;border:1pxsolidgreen;}

tr{

display:block;/*将tr设置为块体元素*/

margin:2px0;/*设置tr间距为2px*/

显示效果

CSS控制表格tr之间的边距