2014-04-04 50 views
0

我试图为我的电子邮件制作一个漂亮的HTML按钮(不想使用图像),并且我从Facebook获得了最初的设计理念,该按钮在我的浏览器中很好地呈现,但不在Outlook中。有谁知道我能做些什么来解决它?电子邮件模板中的HTML表格按钮

设计是on our site,并且按钮的代码如下:

<td valign='middle' style='width:92px;padding-left:0px;text-align:right;white-space:nowrap; !important'> 
<div style='height:32px !important;'> 
    <a href='".site_url()."export/export_timesheet?id=".$timeID."' style='color:#3b5998;text-decoration:none;'> 
     <table cellspacing='0' cellpadding='0' width='100%' height='33' style='border-collapse:collapse;border-width:1px;border-style:solid;display:block;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;font-size:14px;border-color:#2C729E;height:33px !important;'> 
      <tbody> 
       <tr><td height='7' colspan='3' style='line-height:7px;'>&nbsp;</td></tr> 
       <tr> 
        <td width='16' style='display:block;width:16px;'>&nbsp;</td> 
        <td width='100%' style='text-align:center;'><a href='".site_url()."export/export_timesheet?id=".$timeID."' style='color:#2C729E;text-decoration:none;display:block;'><center><font size='3'><span style='font-family:Helvetica Neue,arial,sans-serif;font-style:normal;white-space:nowrap;font-size:14px;'><strong>Get PDF</strong></span></font></center></a></td> 
        <td width='16' style='display:block;width:16px;'>&nbsp;</td> 
       </tr> 
       <tr><td height='7' colspan='3' style='line-height:7px;'>&nbsp;</td></tr> 
      </tbody> 
     </table> 
    </a> 
</div> 
</td> 

但是,当它呈现在Outlook中,它看起来是这样的:

enter image description here

我不关心圆形边缘,但我希望高度正常工作。有谁知道我该如何解决这个问题?我尝试过没有运气的高度。

回答

1

试试这个:

<table width="92" border="0" cellpadding="0" cellspacing="0"> 
    <tr> 
    <td height="33" valign="middle" align="center" style="font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #2C729E; border:1px solid #2C729E;"> 
     <a href="" style="color: #2C729E; font-weight: bold; text-decoration: none;">Get PDF</a> 
    </td> 
    </tr> 
</table> 

我有锚标签上的文字,而不是<td>自己的周围。自从我这样测试以来,已经有很长一段时间了,所以我只发布了我所知道的东西。

此外,你知道JavaScript不能用在HTML电子邮件的权利?在发送之前,你必须执行那些东西服务器端。

+0

完美!谢谢。只是一个不是JavaScript的注释,它是PHP。这是一个放入脚本的模板。 :) – dpDesignz

+0

当然 - 我看起来不够坚硬。我应该认识到差异。看到很多人试图运行JS,我只是假设你也是这样做的。 – John