电子邮件文本显示为不同的颜色

时间:2017-11-21 15:39:02

标签: css email colors

Outlook中的颜色均为白色,但手机上的Gmail显示为地址的黑白文字。

我尝试将color: #ffffff;添加到tdtable。我尝试为地址的每个部分添加span,以防<sup>th</sup导致问题。我不确定我还能尝试什么。

enter image description here

<tr>
    <td align="center" valign="middle" bgcolor="#658ead">
        <table cellpadding="0" cellspacing="10" align="center" border="0" width="100%">
            <tr>
                <td align="center" valign="middle"><span style="font:bold 125% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#ffffff; letter-spacing:1.5px; line-height: 150%;">Thursday, November 30<sup>th</sup> <br />1:00 pm</span></td>
            </tr>
            <tr>
                <td align="center" valign="middle" style="color: #ffffff;"><span style="font:normal 125% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#ffffff; letter-spacing:1.5px; line-height: 150%;">2728 North 68 Street, Suite 1 <br />Scottsdale, AZ</span></td>
            </tr>
            <tr>
                <td align="center" valign="middle"><span style="font:bold 100% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#ffffff; letter-spacing:1.5px; line-height: 150%;">Seating is limited </span><br /><span style="font:normal 100% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#ffffff; letter-spacing:1.5px; line-height: 150%;">Kindly respond by November 29<sup>th</sup></span></td>
            </tr>
            <tr>
                <td align="center" valign="middle" bgcolor="#658ead">
                    <table cellpadding="0" cellspacing="5" align="center" border="0" style=" border: 1px solid #ffffff; background:#ffffff;">
                        <tr>
                            <td bgcolor="#ffffff"><a href="mailto:Crystal.Fritz@kravet.com?subject=RSVP to Livable Luxury - Arizona on November 30th" style="font:normal 75% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#658ead; background:#ffffff; line-height:21px; padding: 10px; letter-spacing:1px;">CLICK HERE TO RSVP</a></td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle"><span style="font:italic 85% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#ffffff; letter-spacing:1.5px; line-height: 150%;">Refreshments will be served</span></td>
            </tr>
    </table>
</td>
</tr>

2 个答案:

答案 0 :(得分:1)

我相信它会将该地址的一部分呈现为可点击链接,因此您需要一些CSS来覆盖页脚中的链接样式。也许添加一个类并在标题中的<style>块中声明它:

CSS:

<style type="text/css">
  .footerLink a {
    color: #fff !important;
  }
</style>

HTML:

<td class="footerLink" align="center" valign="middle" style="color: #ffffff;"><span style="font:normal 125% Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#ffffff; letter-spacing:1.5px; line-height: 150%;">2728 North 68 Street, Suite 1 <br />Scottsdale, AZ</span></td>

答案 1 :(得分:0)

你试过了吗?

颜色:白色;这是outlook中的默认值

来自outlook的例子:

<p class=MsoNormal><span lang=EN-GB style='color:white;mso-themecolor:background1'>Sdvsds
s <o:p></o:p></span></p>