html - 如何在表格行上添加边距

我想在表格的行之间添加空间，如下图所示:



如果可能，请向我展示您的代码。

最佳答案

您可以使用 border-spacing 。这是一个简单的例子。

table, th, td {
  background: #ffffff;
  padding: 5px;
}
table {
  background: #999999;
  border-spacing: 15px;
}

<h2>Border Spacing</h2>
<p>Border spacing specifies the space between the cells.</p>

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

<p>Try to change the border-spacing to 5px.</p>

https://www.w3schools.com/html/html_tables.asp

https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_cellspacing

关于html - 如何在表格行上添加边距，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53983509/