我需要帮助来删除表格中这些图像之间的空间。
这是我的 fiddle :http://jsfiddle.net/8EHED/81/
<tr>
<td width="600" align="center" valign="top">
<table cellspacing="0" cellpadding="0" width="600" style="margin: 0; padding: 0;">
<tr>
<td width="480" align="left" valign="bottom" style="background-color:#fee100; margin: 0; padding: 0;">
<img src="http://placehold.it/150x50" style="margin-left:25px"/>
</td>
<td width="120" style="background-color:#fee100;">
<img src="http://placehold.it/120x50" style="margin-right:25px; display:block">
</td>
</tr>
</table>
</td>
</tr>
正如您在 fiddle 中看到的那样，我在另一个表格中使用了表格，因为我想使用宽度为 600 像素的第二个表格将所有内容对齐到中心。
提前谢谢你。
最佳答案
您通常需要将 vertical-align 重置为 top 或 bottom 或在您的情况下 display 为 block 为 img 。
td img {
display:block;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
font-size: 100%;
vertical-align: baseline;
line-height: 1.3em;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: ;
}
img {
display:block;
}<body style="margin:0px; padding:0px; background-color:#ffffff;">
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" align="center">
<table cellspacing="0" cellpadding="0" width="600" style="margin-top:0; margin-bottom:0; margin-left:auto; margin-right:auto; padding:0;">
<tr>
<td width="600" align="center" valign="top">
<table cellspacing="0" cellpadding="0" width="600" style="margin: 0; padding: 0;">
<tr>
<td width="480" align="left" valign="bottom" style="background-color:#fee100; margin: 0; padding: 0;">
<img src="http://placehold.it/150x50" alt="PSNY" style="margin-left:25px" />
</td>
<td width="120" style="background-color:#fee100;">
<img src="http://placehold.it/120x50" style="margin-right:25px; display:block">
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="600" align="center" valign="top">
<table cellspacing="0" cellpadding="0" width="600" style="margin: 0; padding: 0;">
<tr>
<td width="150">
<img src="http://placehold.it/150x50" style="margin-left:25px; display:block">
</td>
<td style="margin: 0; padding: 0;">
<h2 style="font-family:Times New Roman, Times; font-size:24px; color:#000200; text-align: center;"><span style="border-bottom:1px solid #000200; padding-bottom: 5px;">My Title</span></h2>
</td>
<td width="150">
<img src="http://placehold.it/120x50" style="margin-right:25px; float:right; display:block">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>关于html - 删除电子邮件通讯表中图像之间的空间，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39934657/