为什么该白线出现在我的HTML电子邮件签名上?

时间:2019-07-10 21:45:24

标签: html css email signature

我正在设计的电子邮件签名有问题。我只使用了HTML代码,因为我的签名中有几个链接。问题在于,在放置徽标的部分中,它的底部出现了一条白线(我将其标记为黄色,以便可以看到,但实际上是白色的)。实际上,我不知道这是一条白线还是仅仅是电子邮件界面的背景。

为了隐私起见,我已经删除了我的个人信息:

email signature

将徽标从Illustrator中导出为JPG文件时,我将其上载到imgur.com,以将其包含在HTML代码中。我确定白线不在我的jpg文件中,因此应该在我将其上传到imgur时创建,否则可能是代码问题。

<table cellpadding="0" cellspacing="0" border="0" style="background: none; border-width: 0px; border: 0px; margin: 0; padding: 0;">
    <tr>
        <td valign="top" style="padding-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0px; border-top: 0; border-bottom: 0: border-left: 0; "><img id="preview-image-url" src="https://i.imgur.com/3yGlrjw.png"></td>

        <td style="padding-top: 0; padding-bottom: 0; padding-left:0px; padding-right: 0;  background-color:  #f9f9f9">
            
        <table cellpadding="0" cellspacing="0" border="0" style="background: none; border-width: 0px; border: 0px; margin: 0; padding-top: 10px !important; padding-left: 50px; padding-right: 60px; padding-bottom: 10px !important">

            <tr><td colspan="2" style="padding-bottom: 1px; color: #ce173a; font-size: 15px; font-family: Arial, Helvetica, sans-serif; font-weight: bold;">Abcdef Ghijk Lmnop</td></tr>
            <tr><td colspan="2" style="padding-bottom: 10px; color: #333333; font-size: 11px; font-family: Arial, Helvetica, sans-serif;">Graphic Designer & Art Director</td></tr>

            <tr><td width="20" valign="top" style=" padding-top: 9px; vertical-align: top; width: 20px; color: #000000; font-size: 8px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #000;">T.</td><td valign="top" style=" padding-top: 9px; vertical-align: top; color: #333333; font-size: 8px; font-family: Arial, Helvetica, sans-serif;"><a  style=" color: #333333; text-decoration: none; font-weight: normal; font-size: 8px;">+34 636 63 63 63</a>&nbsp;&nbsp;<span style="color: #000000; font-weight: bold; padding-right: 30px; padding-left: 42px; color: #000;"></td></tr>

            <tr><td width="20" valign="top" style=" padding-top: 9px; vertical-align: top; width: 20px; color: #000000; font-size: 8px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #000;">E.</td><td valign="top" style=" padding-top: 9px; vertical-align: top; color: #333333; font-size: 8px; font-family: Arial, Helvetica, sans-serif;"><a href="mailto:my.email@gmail.com" style=" color: #333333; text-decoration: none; font-weight: normal; font-size: 8px;">my.email@gmail.com</a>&nbsp;&nbsp;<span style="color: #000000; font-weight: bold; padding-right: 30px; padding-left: 42px; color: #000;"></td></tr>


            <tr><td width="20" valign="top" style="padding-top: 9px; vertical-align: top; width: 20px; color: #000000; font-size: 8px; font-family: Arial, Helvetica, sans-serif; padding-right:30px; font-weight: bold; color: #000">W.</td><td style="color: #333333; padding-top: 9px; font-size: 8px; font-family: Arial, Helvetica, sans-serif;"><a href="https://behance.net/Mybehance" style="text-decoration: none; color: #333333;">behance.net/MyBehance</a></td></tr>
                
        </table>

        </td>
    </tr>
</table>

您能帮我删除那行吗,所以徽标的高度与文本右侧部分的背景相同?

非常感谢!

1 个答案:

答案 0 :(得分:0)

要查看是否是背景颜色充当白色条,请暂时更改背景颜色以查看其是否更改白色条的颜色。如果是这样,则意味着它不是白色的条,而是背景,并且需要调整图像的高度。但是,如果仍然保留白色条,请尝试将img的边距和填充设置为0。

img {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}