20

Eric meyer reset css 建议“表格在标记中仍需要 'cellspacing="0"'”。有必要吗?有什么好处border-collapse: collapse;和border-spacing: 0;

它只是建议使用单元格间距,而表格还有另一个称为单元格填充的属性?

/* tables still need 'cellspacing="0"' in the markup */
table {
        border-collapse: collapse;
        border-spacing: 0;
}

Internet Explorer 67,可能还有其他早期浏览器,不识别该border-spacing属性,因此,他建议您仍然在 HTML 中提供值。

查看 SitePoint 上的兼容性表

4

3 回答 3

12

cellpadding不建议使用,因为paddingcss 属性充分覆盖了cellpaddingtable 属性的默认属性。正如另一个答案所说,在较旧的浏览器中没有兼容的 CSS 属性cellspacing,将 HTML 属性作为完全“重置”此设置为 0 的唯一方法 border-spacing: 0;。为支持它的浏览器处理这个问题。

至于border-collapse——默认情况下,每个表格单元格都有自己的边框,并将collapse相邻单元格之间的边框合并在一起,呈现出(通常是单像素)网格的外观,这是cellspacing="0". 以前border-collapse普遍支持,这就是为什么您会在表格上看到带有cellspacing="1"背景颜色的表格,以及在表格单元格上看到白色背景的原因。

border-collapse:collapse;在 reset.css 中只是因为它是最常见的期望结果。如果你不想要这种模式,你可以从 reset.css 中删除它。

于 2010-01-16T17:52:53.357 回答
6

Internet Explorer 67,可能还有其他早期浏览器,不识别该border-spacing属性,因此,他建议您仍然在 HTML 中提供值。

查看 SitePoint 上的兼容性表

于 2010-01-16T17:45:43.853 回答
2

表格中有两种边框,表格本身可以有边框(外边框和单元格之间的边框),每个单元格周围可以有边框。

使用border-collapse: collapse;意味着两个相邻的具有相同边框设置的单元格将仅获得一组边框而不是双边框,例如,一个单元格的右边框将与行中下一个单元格的左边框一起折叠。

在 CSS 2 之前,单元格之间的表格边框没有 CSS 样式,因此必须使用cellspacing="0"表格上的 HTML 属性禁用它以支持旧版浏览器,例如 IE 7*。如果单元格之间有表格边框,边框折叠自然不会起作用,因为边框不是彼此相邻的。

* 我真的很享受将 IE 7 称为“旧版浏览器”的感觉;)

于 2010-01-16T17:51:12.610 回答