📜  在 CSS 中设置 cellpadding 和 cellpacing(1)

📅  最后修改于: 2023-12-03 15:07:38.501000             🧑  作者: Mango

在 CSS 中设置 cellpadding 和 cellpacing

在 HTML 表格中,使用 cellpadding 属性来定义表格单元格和其边框之间的空白空间大小;使用cellspacing 属性来定义相邻表格单元格之间的空白空间大小。

为了让 CSS 控制这些属性,你可以利用 table 和 td 标记的 padding 和 margin 样式。

CSS padding 属性定义元素与元素内容之间的距离;margin 属性定义元素与其它元素之间的距离。

下面举个栗子:

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td {
  padding: 10px;
  border: 1px solid #ddd;
}

在上面的例子中,我们定义了 table 的 border-collapse 和 border-spacing 属性。 border-collapse 设置表格单元格的边框是否合并在一起;border-spacing 设置相邻表格单元格之间的空白距离。

接着,我们定义了 td 标记的 padding 和 border 样式。 padding 定义了单元格与单元格内容之间的空白空间,并且 border 定义了单元格的边框。

总之,在 CSS 中设置 cellpadding 和 cellspacing 的方式是:

  1. 通过 table 的 border-collapse 和 border-spacing 属性控制表格单元格的边框和相邻单元格之间的空白距离。
  2. 通过 td 的 padding 和 margin 属性来定义单元格与单元格内容之间的空白距离和单元格与其它元素之间的空白距离。