前端设计

css table加边框

2024-01-07

要在CSS中为表格添加边框,可以使用border属性。

如果想要所有单元格都显示边框,可以将table的border-collapse属性设置为"separate"(默认值)或者"collapse",然后再通过td或th标签来定义每个单元格的边框样式。

下面是一个示例代码:

<style>

table {

border-collapse: separate; /* 分开模式 */

width: 100%; /* 表格宽度 */

}

th, td {

border: 1px solid black; /* 边框样式 */

padding: 8px; /* 内边距 */

}

</style>

<table>

   <tr>

      <th>列名1</th>

      <th>列名2</th>

      <th>列名3</th>

   </tr>

   <tr>

      <td>数据1</td>

      <td>数据2</td>

      <td>数据3</td>

   </tr>

<!-- 其他行 -->

</table>