我正在设计一个电子邮件事件，我的要求没有规定 CSS。不要让我开始说这个。
除下表外，一切正常。角落部分与表格的其余部分偏移了一个像素，我终究无法弄清楚我在哪里放错了分号或其他东西。
角 block 是相同的 15x15 图像，只是根据角旋转了 90 度。但是你可以看到线条一直延伸到边缘，所以图像上没有额外的填充。
我尝试了越来越少的各种迭代 <t*属性，在表格、行和单元格级别设置内容，以及 99% 的在线搜索都让我进行了关于确保跨度正常工作的问答——我认为我的是。当我使用 border=1 属性让我不怀疑边界是罪魁祸首时，上限仍然存在。
我使用的是 4 列 x 3 行，最外面的列和行包含一个 15px X 15px 的角图像 (gif)，角之间的单元格有一个白色背景和一个 1px X 1px gif 间隔对齐和拉伸(stretch)在角图像之间给我一条线。
中间部分是一个带有图标的单元格，后面是一个文本单元格。我需要创建 5 个这样的要点；我添加了第二个空白框来显示当其中两个相互对接时会发生什么。
有人对我可以查看的内容、我需要添加的内容或需要从我的代码中减去的内容有任何想法吗？
<html>
<body style='background:f3f7f8'>
<table border=0 width=430 style='font-size=12px;cellpadding=0;cellspacing=0;border-collapse:collapse;'>
<tr>
<td width=15 height=15><img src="644810_tl.png" width=15 height=15 ></td>
<td colspan=2 valign="top" style='background:ffffff'><img src="dkgray.gif" width=400 height=2></td>
<td width=15 height=15><img src="644810_tr.png" width=15 height=15></td>
</tr>
<tr>
<td style='background=ffffff' align=left><img src="dkgray.gif" width=2 height=100></td>
<td style='background=ffffff' width=75 align=center valign=center><img src="icon-pdf.gif"></td>
<td style='background=ffffff' width=325 align=left valign=cener><strong>Lorem Ipsum<br></strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dignissim risus at quam hendrerit aliquet. Nunc et felis elit. Fusce pharetra adipiscing velit vel pharetra. Donec ornare velit sed massa tempor at tempor sem lacinia. Quisque enim nisl, auctor sit amet volutpat eget, porttitor sit amet tortor. Nulla ut sodales magna. Morbi adipiscing est urna, ac gravida erat.</td>
<td style='background=ffffff' align=right><img src="dkgray.gif" width=2 height=100></td>
</tr>
<tr>
<td width=15 height=15 style='background=ffffff'><img src="644810_bl.png" width=15 height=15></td>
<td colspan=2 valign="bottom" style='background:ffffff;cellpadding=0;cellspacing=0;border-collapse:collapse'><img src="dkgray.gif" width=400 height=2></td>
<td width=15 height=15 style='background=ffffff'><img src="644810_br.png" width=15 height=15></td>
</tr>
<tr>
<td width=15 height=15><img src="644810_tl.png" width=15 height=15 ></td>
<td colspan=2 valign="top" style='background:ffffff'><img src="dkgray.gif" width=400 height=2></td>
<td width=15 height=15><img src="644810_tr.png" width=15 height=15></td>
</tr>
<tr>
<td width=15 height=15 style='background=ffffff'><img src="644810_bl.png" width=15 height=15></td>
<td colspan=2 valign="bottom" style='background:ffffff;cellpadding=0;cellspacing=0;border-collapse:collapse'><img src="dkgray.gif" width=400 height=2></td>
<td width=15 height=15 style='background=ffffff'><img src="644810_br.png" width=15 height=15></td>
</tr>
</table>
</body>
</html>
最佳答案
使用边框折叠，这会将单元格的边框折叠为一个边框。
table
{
border-collapse:collapse;
}
关于html - 我怎样才能摆脱表格单元格之间的这个像素空间？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11419541/