是否有必要在?<table> </table>中添加cellspacing =“0”cellpadding =“0”

时间:2010-01-16 17:43:02

标签: html xhtml w3c

Eric meyer重置css表示“表格仍然需要'cellspacing =”0“'在标记中”。有必要吗?什么是border-collapse: collapse的好处;和border-spacing: 0;

并且它只建议使用cellspacing,而table有另一个名为cellpadding的属性?

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

3 个答案:

答案 0 :(得分:11)

不建议使用

cellpadding,因为padding css属性足以覆盖cellpadding表属性的默认属性。正如另一个答案所说,旧版浏览器中cellspacing没有兼容的CSS属性,只留下HTML属性作为将此设置完全“重置”为0的唯一方法。border-spacing: 0;负责处理此问题。支持它的浏览器。

至于border-collapse - 默认情况下,表格单元格各有自己的边框,collapse会将相邻单元格之间的边框合并在一起,从而呈现出(通常是单像素)网格的外观, cellspacing="0"时无法以其他方式实现。在border-collapse得到普遍支持之前,这就是为什么您会看到表格中带有cellspacing="1"和背景颜色的表格,以及表格单元格上的白色背景。

border-collapse:collapse;位于reset.css中,因为它是最常见的预期结果。如果您不想使用此模式,可以将其从reset.css中删除。

答案 1 :(得分:6)

Internet Explorer 6 7,可能还有其他早期版本的浏览器,无法识别border-spacing属性,因此,他建议您仍然在HTML中提供值。< / p>

Check out the compatibility table on SitePoint

答案 2 :(得分:2)

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

使用border-collapse: collapse;表示相邻边框设置相同的两个单元格只能获得一组边框而不是双边框,例如一个单元格的右边框将在行中下一个单元格的左边框处折叠。

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

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