Question

我正在尝试用表格制作新闻稿。每个邮件客户端的div框不能达到100％。

如你所见，这里

enter image description here

这是我在Photoshop中准备的，我对表有一些问题。如何在两个图像之间删除这个空格并将文本背景颜色（在图片和按钮的中间）更改为灰色，如果我给它一个新的td，则无效。它应该看起来像我上传的图片。如果你可以帮助我，那将是非常好的。

<td width="29">&nbsp;</td>
            <td width="291" valign="top">
                <a target="_blank" href="#">
                <img src="images/angebotbild1.jpg" style="display: block;" border="0" width="355" height="150"></a>

                <div style="margin-top: 3px;"></div>

                <font color="#778da7" face="Trebuchet, Arial, Verdana, Helvetica, sans-serif" size="2" style="font-size: 12px">
                    Wie gemacht für alle, die den etwas 
                    anderen Sommer 
                    erleben wollen: Diese Reise führt Sie zu den großen 
                    Metropolen und kleinen Städten des Baltikums. Jede 
                    davon wird Sie durch den Kontrast zwischen prunkvoller 
                    Architektur in den historischen Stadtzentren und der 
                    nachhaltigen in den neuen Arealen Bauweise faszinieren. 
                    Jeder Ort erzählt hier seine eigene, spannende 
                    Geschichte. Lassen Sie sich verzaubern.
                </font>
                <a  href="#" alt="Book now" target="_blank" style="color:#cc1f2f; font-weight:bold; text-decoration:none;float:right"><img border="0"  src="images/button.jpg" width="335" height="60" style="display:block;" border="0" /></a>
            </td>
        </tr>
        </table>

jsfiddle 这是完整的代码，

Answer 1

在a到 float:right

float:left

更改a链接中的img标记，并使图像宽度为355而不是335。底部按钮是一个图像（button.jpg），您只能通过使用photoshop编辑来更改它的背景颜色，并且不要忘记将其图像大小更改为355px。

下次请将您的文件放在公共区域，我们无法看到它现在看起来是什么，只能猜测它看起来是怎样的。

Answer 2

由于OP答案似乎已经涵盖，所以这里有一个替代输出选项供您将来使用：

不是自己创建表并手动使用代码，而是允许Photoshop在save for web选项中自动执行该过程。此替代方法允许您保存图像和文本，因此您在该部分中的文本区域将只是切片类型的无图像（在切片上右键单击切片工具＆gt;编辑切片选项）。现在只需在选定的切片中添加文本即可。

当您保存为网络时，它将输出一个表格，图像和文字正确对齐。然后，您可以使用css清理表格中的文本以满足您的需求。

无法删除表格中的空格和背景颜色

2 个答案: