Is it necessary to add cellspacing=“0” cellpadding=“0” in <table>?

こ雲淡風輕ζ 提交于 2019-12-05 09:58:38

问题


Eric meyer reset css is suggesting "tables still need 'cellspacing="0"' in the markup". Is it necessary? and what is the benefit of border-collapse: collapse; and border-spacing: 0;?

and it's only suggesting to use cellspacing, while table has another property called cellpadding?

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

回答1:


cellpadding is not suggested because the padding css property sufficiently overrides the default properties for the cellpadding table attribute. As the other answer says, there is no compatible CSS property for cellspacing in older browsers, leaving an HTML attribute as the only way to completely "reset" this setting to 0. border-spacing: 0; takes care of this for browsers which do support it.

As for border-collapse — by default, table cells each have their own border, and collapse will merge the borders between adjacent cells together, giving the appearance of a (usually single-pixel) grid, which isn't achievable any other way when cellspacing="0". Before border-collapse was commonly supported, this is why you'd see tables with cellspacing="1" and a background color on the table, and white backgrounds on table cells.

border-collapse:collapse; is in the reset.css simply because it is the most common desired result. If you don't want this mode, you'd be fine removing this from the reset.css.




回答2:


Internet Explorer 6 and 7, and probably other early browsers, do not recognize the border-spacing attribute and as such, he suggests you still supply the values in the HTML as well.

Check out the compatibility table on SitePoint




回答3:


There are two types of borders in a table, the table itself can have borders (outer borders and borders between cells), and each cell can have borders around them.

Using border-collapse: collapse; means that two cells with the same border settings next to each other will only get a single set of bordering instead of a double, e.g. the right border of one cell will collapse with the left border on the next cell in the row.

There wes no CSS style for the table border between cells until CSS 2, so it has to be disabled using the HTML attribute cellspacing="0" on the table to support older browsers like IE 7*. If there is table borders between the cells, the border collapsing will naturally not work as the borders are not next to each other.

* I truly enjoyed the feeling of calling IE 7 an "older browser" ;)



来源:https://stackoverflow.com/questions/2078309/is-it-necessary-to-add-cellspacing-0-cellpadding-0-in-table

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!