[分享]css单元格行间距

在HTML表格中，单元格行间距是一项非常重要的CSS样式。它决定了表格中每行单元格之间的距离，使得表格的布局更加美观、整洁。设置单元格行间距非常简单，只需在CSS中使用bordercollapse属性...

在HTML表格中，单元格行间距是一项非常重要的CSS样式。它决定了表格中每行单元格之间的距离，使得表格的布局更加美观、整洁。

设置单元格行间距非常简单，只需在CSS中使用border-collapse属性，并将其值设置为separate即可。

table {
  border-collapse: separate;
  border-spacing: 10px;
} 

在上面的CSS代码中，border-collapse: separate;表示使用单独的边界，border-spacing: 10px;表示单元格之间的间距是10px。

除了border-spacing属性外，还可以使用padding属性来设置单元格内边距，进一步使表格整洁美观。

table {
  border-collapse: separate;
  border-spacing: 10px;
  padding: 10px;
}
td {
  padding: 5px;
} 

在上面的CSS代码中，padding: 10px;表示表格的内边距是10px，td {padding: 5px;}表示每个单元格内边距是5px。

总体而言，单元格行间距是表格布局中重要的一环。通过设置适当的行间距和内边距，可以轻松地创造出令人愉悦的表格布局。