Question

我正在尝试创建单个页面，将用作简报，因此我的代码是html / css inline。

我想在整个表格后面添加背景图片，以便徽标和文字显示在前景中。

我尝试过添加

style="background-image: url("bg.jpg")"

和

style= "background: url(bg.jpg)"

所以最终的代码看起来像是

<table style="background: url(sportip.biz/alpha.jpg)" border="0" cellpadding="0" cellspacing="0" align="left" class="deviceWidth">
    <tr>
        <td style="padding:10px 20px" class="center">
            <a href="#"><img src="http://sportip.biz/nlsiplogo.jpg" alt="" border="0" /></a>
        </td>
    </tr>
</table>

我认为我在做错线。

Answer 1

jsfiddle.net/shanidkv/g0dd3vcm/1 /

找到更新的JSfiddle代码。

注意：尝试将以上网址复制并通过浏览器面临一些问题直接或在文字顶部附加链接

Answer 2

许多电子邮件客户端不支持在表格中呈现背景图像。请参阅此处以获取解决方法的一些示例：http://blog.mailermailer.com/email-design/background-images-in-html-email-the-naked-truth

Answer 3

我希望这就是你要找的东西：

<table style="background: url(sportip.biz/alpha.jpg)" border="0" cellpadding="0" cellspacing="0" align="left" class="deviceWidth">

<tr>
<td style="padding: 10px 20px" class="center">
<a href="#"><img src="http://sportip.biz/nlsiplogo.jpg" alt="" border="0" /></a>
</td>
</tr>

</table>
<!-- End Logo -->

<!-- Nav -->
<table style="position: absolute; margin-top: 0; margin-left: 0;" border="0" cellpadding="0" cellspacing="0" align="right" class="deviceWidth">

<tr>
<td class="center" style="font-size: 13px; color: #272727; font-weight: light; text-align: right; font-family: Georgia, Times, serif; line-height: 20px; vertical-align: middle; padding:10px 20px; font-style:italic">
<b>Dear #name#,
Check out the latest releases of our magazines</b>
</td>
</tr>

</table>

这里是fiddle。

HTML / CSS内联背景图片

3 个答案: