Question

这个错误真让我头痛。出于某种原因，我的桌子在中间单元格的左侧和右侧有1px的间隙。我不知道造成这种情况的原因。您可以在此处查看示例：http://jsfiddle.net/JdayW/1/

我需要的是中间单元格中的图像作为“蒙版”，以便您可以看到它背后的背景图像。图像的左侧和右侧需要有一个纯色，可以伸展到浏览器窗口的边缘。我认为一张桌子是实现这一目标的最好方法..但我可能是错的。当我在中间单元格或整个桌子上放置背景颜色时，间隙消失了，但显然这对我不起作用，因为我不能在图像后面有背景颜色。

在网站中，我正在构建这个具有透明度的“蒙版”图像，将在其后面的固定背景上滚动。所以我不能只让png成为背景上的背景。

是否发生这种情况是因为我将表格设置为width:100%而中间单元格设置为固定的300px宽度？

Answer 1

出于某种原因，您的td代码导致了边距。将它们设置为0并为左右td标签提供50％的宽度似乎可以解决问题：

table {width:100%; height:300px; border-collapse: collapse; border-spacing: 0;}

td.left, td.right {background-color:green; margin:0; padding:0; width:50%;}

td.middle {width:300px; margin:0; padding:0;}

工作jsfiddle：http://jsfiddle.net/JdayW/34/

Answer 2

您是否尝试仅在中心td设置0px的填充？ http://jsfiddle.net/JdayW/45/

td.middle {width:300px;padding: 0px}

左边和右边的tds在每一边都有一个1px的间隙，但由于背景颜色包含填充，你没有看到，如果你在每个td上放置一个空格，你可以将所有tds设置为填充：0px { {3}}

表格单元格之间的差距为1px

2 个答案: