有关表格双层边框的坑

今天刷百度前端学院试题的时候发现了一个奇怪的现象，给table元素的td元素分别加上不同颜色的background-color中间会有一条边框，类似这个样子

由于这一道尴尬的白线实在是影响页面整洁度，所以我考虑试着把边框颜色也填充成backgroung-color中方的颜色，试图得到没有白线的完美表格，添加了表格边框之后（在这里为了凸显差异性，我选择了颜色对比明显的对比色来填充边框颜色）

那道令人尴尬的白色线条依然存在，经过我的仔细分析，问题好像并没有那么简单，下面是我为table，tr，td元素都添加了边框之后显示的

那么问题来了，既然不是边框宽度，白色的框框是什么东西？

通过对度娘的搜索，我发现了border-collapse这个CSS元素，一下为W3C中的介绍：

定义和用法

border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。

默认值：	separate
继承性：	yes
版本：	CSS2
JavaScript 语法：	object.style.borderCollapse="collapse"