mc：可重复的背景颜色 mailchimp答案

【问题标题】：mc:Repeatable background color mailchimpmc：可重复的背景颜色 mailchimp
【发布时间】：2019-02-18 07:16:58
【问题描述】：

我的 html MailChimp 模板中有可重复的部分，但无法弄清楚如何为客户提供在白色或绿色之间更改背景颜色的选项。

到目前为止我已经尝试过了

/*
@tab background-test
@section background-Colour
*/

    .background-test {
        /*@editable*/background-color:#000000 !important;
    }

这在体内

<table width="650" border="1" cellspacing="0" cellpadding="0" align="center" class="wrapper" style="margin-left:auto; margin-right:auto; table-layout:fixed;" mc:repeatable mc:variant="test color">
  <tr>
    <td align="center" valign="top" class="background-test">
      <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" mc:edit="change-background">
        <tr>
          <td width="30" class="hide"> </td>
          <td align="center" valign="top" class="pad_side">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
              <tr>
                <td height="30" class="fix_height"> </td>
              </tr>
              <tr>
                <td class="white" align="center" valign="top" style="font-family:Arial, sans-serif;font-size:24px;line-height:27px;color:#ffffff;" mc:edit="section2_maintitle">Neque porro quisquam est qui dolorem ipsum</td>
              </tr>
              <tr>
                <td height="7" style="line-height:1px;font-size:1px;"> </td>
              </tr>
              <tr>
                <td class="white" align="center" valign="top" style="font-family:Arial, sans-serif;font-size:14px;letter-spacing:1px;line-height:17px;color:#ffffff;" mc:edit="section2_semititle">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</td>
              </tr>
              <tr>
                <td height="30" class="fix_height"> </td>
              </tr>
            </table>
          </td>
          <td width="30" class="hide"> </td>
        </tr>
      </table>
    </td>
  </tr>

</table>

但我希望能够更改每个部分的背景颜色，而不是所有重复的都相同。

另外 - 有没有办法让他们只能在 2 种颜色之间进行选择 - 在这种情况下，白色或绿色 (#82c9c2)？

谢谢

【问题讨论】：

标签： html-email mailchimp

【解决方案1】：

你能增加一个额外的类吗？像这样：

/*
@tab background-test
@section background-Colour
*/

    .background-green {
        /*@editable*/background-color:green !important;
    }
    .background-white {
        /*@editable*/background-color:white !important;
    }

在正文中：

<table width="650" border="1" cellspacing="0" cellpadding="0" align="center" class="wrapper" style="margin-left:auto; margin-right:auto; table-layout:fixed;" mc:repeatable mc:variant="test color">
  <tr>
    <td align="center" valign="top" class="background-green">
      <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" mc:edit="change-background">
        <tr>
          <td width="30" class="hide background-white"> </td>
          <td align="center" valign="top" class="pad_side">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
              <tr>
                <td height="30" class="fix_height"> </td>
              </tr>
              <tr>
                <td class="white" align="center" valign="top" style="font-family:Arial, sans-serif;font-size:24px;line-height:27px;color:#ffffff;" mc:edit="section2_maintitle">Neque porro quisquam est qui dolorem ipsum</td>
              </tr>
              <tr>
                <td height="7" style="line-height:1px;font-size:1px;"> </td>
              </tr>
              <tr>
                <td class="white" align="center" valign="top" style="font-family:Arial, sans-serif;font-size:14px;letter-spacing:1px;line-height:17px;color:#ffffff;" mc:edit="section2_semititle">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</td>
              </tr>
              <tr>
                <td height="30" class="fix_height"> </td>
              </tr>
            </table>
          </td>
          <td width="30" class="hide"> </td>
        </tr>
      </table>
    </td>
  </tr>

</table>

【讨论】：