Question

我正在使用电子邮件基础开发响应式电子邮件营销。

我已经验证了所有电子邮件客户端，但是Gmail出现了问题，尤其是在Android上。

显然，是在每个表之间添加了空白。

这个问题有解决方案吗？

下面是我在Codepen中的代码的链接（代码很大，可以在此处发布）和显示错误的打印件。

谢谢

Print with the spaces

                    <table class="row" style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                  <tbody>
                    <tr style="padding: 0;vertical-align: top;text-align: left;">
                      <th class="small-12 large-12 first columns no-padding" style="padding: 0 !important;">
                        <table style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                          <tbody>
                            <tr style="padding: 0;vertical-align: top;text-align: left;">
                              <th>
                                <img src="http://placehold.it/500x200.jpg" alt="Reinventa la forma de jugar" width="650" height="187" style="outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;width: 100%;max-width: 100%;clear: both;display: block;">
                              </th>
                            </tr>
                          </tbody>
                        </table>
                      </th>
                    </tr>
                  </tbody>
                </table>

Answer 1

我的声誉不允许我发表评论。您是否尝试过以下方法：

table .row {
   margin: 0;
   padding:0;
}

或

table .row {
   margin-top: 0;
   padding-top:0;
}

希望这对您有帮助...

Answer 2

您在表行中使用TH。尝试放入style="margin:0px; padding:0px;"，看看是否有帮助。

                    <table class="row" style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                  <tbody>
                    <tr style="padding: 0;vertical-align: top;text-align: left;">
                      <th class="small-12 large-12 first columns no-padding" style="padding: 0 !important;">
                        <table style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                          <tbody>
                            <tr style="padding: 0;vertical-align: top;text-align: left;">
                              <th style="margin:0px; padding:0px;">
                                <img src="http://placehold.it/500x200.jpg" alt="Reinventa la forma de jugar" width="650" height="187" style="outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;width: 100%;max-width: 100%;clear: both;display: block;">
                              </th>
                            </tr>
                          </tbody>
                        </table>
                      </th>
                    </tr>
                  </tbody>
                </table>

TH的设计意图是用于标题（表格标题）。字体将为粗体，并在其周围增加一些空间。除非您使用它将列分成行，否则我建议坚持使用表数据（td）。

希望以上帮助。

Answer 3

希望这会有所帮助。

在桌子上

cellspacing="0"

在每张图片上：

style="display:block;"

Gmail中的基础电子邮件错误

3 个答案: