Mailchimp 在整个模板设计中应用 table 的边框

Question

Mailchimp 太令人沮丧了。我正在尝试使用我所做的模板制作广告系列。它应该看起来像这样：

但是当我尝试粘贴从 google 张复制的 table 时，它看起来像这样

我该如何解决？每次我要粘贴 table 时如何使边框消失？

如果您想知道这是源代码（我删除了内容，因为它属于机密并且超过了 30,000 个字符的限制）：

<style type="text/css"><!--td {border: 1px solid #ccc;}br {mso-data-placement:same-cell;}-->
</style>
<table border="1" cellpadding="0" cellspacing="0" dir="ltr">
<colgroup>
    <col width="277" />
    <col width="100" />
    <col width="100" />
    <col width="113" />
    <col width="114" />
    <col width="49" />
    <col width="79" />
    <col width="2" />
    <col width="100" />
    <col width="100" />
</colgroup>
<tbody>
    <tr>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;AS OF: 8/29/16&quot;}">AS OF: 8/29/16</td>
        <td colspan="6" data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;DIGITAL CARDS / CODES\n Official Pins or Scans with Text&quot;}" rowspan="1">DIGITAL CARDS / CODES<br />
        Official Pins or Scans with Text</td>
        <td>&nbsp;</td>
        <td colspan="2" data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;PHYSICAL CARDS\n Free shipping on 500+ units&quot;}" rowspan="1">PHYSICAL CARDS<br />
        Free shipping on 500+ units</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td colspan="2" data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;&lt; 100 Units&quot;}" rowspan="1">&lt; 100 Units</td>
        <td colspan="2" data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;100+ Units\n Call/Email for pricing on 1000+ units per item&quot;}" rowspan="1">100+ Units<br />
        Call/Email for pricing on 1000+ units per item</td>
        <td colspan="2" data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Format&quot;}" rowspan="1">Format</td>
        <td>&nbsp;</td>
        <td colspan="2" data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Call/Email for pricing\n on 1000+ units per item&quot;}" rowspan="1">Call/Email for pricing<br />
        on 1000+ units per item</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Unit Cost&quot;}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;% Off MSRP&quot;}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Unit Cost&quot;}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;% Off MSRP&quot;}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Pins&quot;}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Scans + Text&quot;}">&nbsp;</td>
        <td>&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;Unit Cost&quot;}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;% Off MSRP&quot;}">&nbsp;</td>
    </tr>
    <tr>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:10}">&nbsp;</td>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0.00&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:9.15}">&nbsp;</td>
        <td data-sheets-numberformat="[null,3,&quot;0.00%&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:0.085}">&nbsp;</td>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0.00&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:9.1}">&nbsp;</td>
        <td data-sheets-numberformat="[null,3,&quot;0.00%&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:0.09}">&nbsp;</td>
        <td data-sheets-value="{&quot;1&quot;:2,&quot;2&quot;:&quot;\u25cf&quot;}">&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0.00&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:9.1}">&nbsp;</td>
        <td data-sheets-numberformat="[null,3,&quot;0.00%&quot;,1]" data-sheets-value="{&quot;1&quot;:3,&quot;3&quot;:0.09}">&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0&quot;,1]">&nbsp;</td>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0.00&quot;,1]">&nbsp;</td>
        <td data-sheets-numberformat="[null,3,&quot;0.00%&quot;,1]">&nbsp;</td>
        <td data-sheets-numberformat="[null,4,&quot;\&quot;$\&quot;#,##0.00&quot;,1]">&nbsp;</td>
        <td data-sheets-numberformat="[null,3,&quot;0.00%&quot;,1]">&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</tbody>
</table>

Answer 1

table 应用边框更改 border="0"

<table border="0" cellpadding="0" cellspacing="0" dir="ltr">

Answer 2

第 1 步： 将每个 <table> 设置为 border="0"

<table border="0" cellpadding="0" cellspacing="0" dir="ltr">

第二步：删除注释掉的td {border: 1px solid #ccc;}

您现在应该在任何地方都没有边框，所以返回并在 <td>s（最佳）或 <table>s 上仅添加您想要的带有内联样式的边框。例如：

<table border="0" cellpadding="0" cellspacing="0" dir="ltr">
    <tr>
        <td style="border-top: 1px solid #ffffff;">
            content
        </td>
    </tr>
</table>

这应该会生成一封没有任何无意边框的电子邮件。我不确定 Google 表格中的粘贴是什么样的，但您需要以这种方式编辑 HTML 以确保其正确显示。

Mailchimp 在整个模板设计中应用 table 的边框

Mailchimp applies the table's border in the whole template design

html

css

html-table

mailchimp

newsletter