Question

我目前正在为项目制作电子邮件模板。基本上，我有一个表设置，一行包含一些条纹，下一个黑色条（以匹配网站的布局）。

问题是：有没有办法将图像放在表格中，让它继续进入第二行而不破坏第二行的格式？

非常感谢，将

编辑：

这是目前的展望：

<table style="width: 100%; height:18vh;" cellspacing="0" cellpadding="0" style=" border-collapse: collapse; border-spacing: 0;" background="http://s588191233.websitehome.co.uk/projects/kindle/img/emailwallpaper.jpg">
<tr height="80%">
    <td>
    </td>
</tr>
<tr style="background: #222; height: 20%;">
    <td> 
    </td>
</tr>
</table>

尝试将图像显示在左侧。通常，我会通过绝对定位实现这一目标，但我不能将其作为电子邮件。我们试图对图像进行细分，但是在电子邮件客户端之间进行扩展可以证明这是不可能的。

Answer 1

您可以使用＆＃34; rowspan＆＃34;执行此操作。代码如下，这里是fiddle。

    <table style="width: 100%; height:18vh;" cellspacing="0" cellpadding="0" style=" border-collapse: collapse; border-spacing: 0;">
        <tr>
            <td rowspan="2" style="background: url('https://leadingpersonality.files.wordpress.com/2013/05/smug-smile.jpg'); background-size: cover; background-repeat: no-repeat; background-position: center center; width: 100px;"></td>
            <td style="background-image: url('http://s588191233.websitehome.co.uk/projects/kindle/img/emailwallpaper.jpg');">
                <div style="height: calc(18vh * .8);"></div>
            </td>
        </tr>
        <tr>
                <td style="background: #222;"><div style="height: calc(18vh * .2);"></div></td>
        </tr>
    </table>

电子邮件CSS / HTML - 图像位置

1 个答案: