Question

我有一个图像，我想用作HTML电子邮件下面带有非白色背景颜色的水平重复横幅，它也可以缩放以适应高度。虽然目前正在重复，但我无法正确缩小图像。标题元素设置为100px，但图像不会调整大小并被下一个元素截断。

HTML

<body style="margin: 0; padding: 0;" >

  <!-- CONTAINER TABLE (HEADER) -->
  <table border="0" cellpadding="0" cellspacing="0" width="100%" style=" table-layout: fixed;">
    <tr>
      <td align="center" bgcolor="#339969" style="padding: 0 0 0 0;">

        <!-- HIDDEN PREHEADER -->
        <div style="display: none; font-size: 1px; color:#333333; line-height: 1px; font-family: Arial, sans-serif; max-height: 0px; max-width: 0px; opacity: 0; overflow: hidden; mso-hide: all;">
          Some text.
        </div>
        <!-- WRAPPER TABLE -->
        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="wrapper">
          <!-- HEADER -->
          <tr>
            <td>
              <table border="0" cellpadding="0" cellspacing="0" width="100%">
                <tr>

                <!-- HERE need to properly scale then repeat this image -->
                  <td align="left"  
                      background="img/large_christmasbanner.png" 
                      background-size="contain" 
                      alt="Bappy Bolidays!" 
                      width="100%" 
                      height="100">
                  </td>

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

Answer 1

background-size="contain"不是有效的html属性。请改用：

style="background-size: contain;"

如何在HTML电子邮件中创建重复的标题图像？

1 个答案: