Question

我正在制作HTML电子邮件。当我在gmail中查看模板时，它会在图像周围添加额外的填充。

我用过：

border-spacing:0;
display:block;

但它没有用。

HTML

<table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; margin: 0 auto; border-spacing:0px;  margin-left: 15px;" align="left" border="0" cellpadding="0" cellspacing="0">
    <tbody>
        <tr>
            <td align="center">
                <table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="110">
                    <tbody>
                        <tr>
                            <td align="center" height="100" valign="top" width="110">
                                <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                    <a class="modimg" style="text-decoration: none!important;" href="#">
                                        <img style="display: block; border: 3px solid #ffcbbc; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" border="0" height="110" width="110">
                                    </a>
                                </p>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
        <tr>
            <td class="h2" style="font-weight: bold;font-family: 'Montserrat', sans-serif; padding-top: 2px; padding-bottom: 0px;color:#ffffff;">
                <p style="padding: 0; margin: 0 auto; max-width: 110px; text-align: center;font-size: 10px;">
                    <span class="wrap_textbox">Mr. R. Chandrasekhar</span>
                </p>
                <p style="padding:0; margin:0 auto; max-width:110px;text-align: center !important; font-size: 8px;">
                    <span class="wrap_textbox">President at NASSCOM</span>
                </p>
            </td>
        </tr>
    </tbody>
</table>

谢谢。

Answer 1

我无法在上面重现您的问题，但我注意到一些可能解决问题的方法。

试试这个（从上面例子的第6行开始）。

<table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="110">
    <tbody>
        <tr>
            <td align="center" height="100" valign="top" width="110">
                <a class="modimg" style="text-decoration: none!important;" href="#">
                    <img style="display: block; border: 3px solid #ffcbbc; outline: none; text-decoration: none;-ms-interpolation-mode: bicubic; display: block; mso-height-rule: exactly; line-height: 1;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" border="0" height="110" width="110">
                </a>
            </td>
        </tr>
    </tbody>
</table>

Answer 2

使用padding:0，margin:0。根据你的需要，你想把它们放在哪里。

gmail

2 个答案: