Outlook on WIndows 10邮件样式

Question

该按钮的背景色样式在Outlook电子邮件客户端上不起作用，尽管它在其他客户端和浏览器上可以正常工作(甚至在MacOS的Outlook上也是如此)。

不工作：

​

​

它应该是什么样子：

​

​

代码：

<td align="right" valign="center" style="margin: 0; padding: 20px;" width="200">
    <a href="{{ company['url'] }}">
        <button style="color: #ffffff; background-color: #00A4FF; font-size: 12px;
            cursor: pointer; border: none; font-weight: bold; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; padding-right: 20px;" >
            {{ translation._('company.view.emailTemplatesCompaniesOfUser.go') }}
        </button>
    </a>
</td>

Answer 1

我认为如果你只能使用元素并去掉元素，可能会对你的解决方案有所帮助。您可以为该元素的表指定背景色。

    <table  align="center" border="0"  width="100" style="border-collapse:collapse;border:0;padding:0px;margin:0px;width:300px;height:50px;border-radius: 3px;background: #00A4FF;text-align:center;">
           
           <tr>
    <td align="right" valign="center" style="margin: 0; padding: 20px;" width="200">
     <p style="padding:0px;margin:0px;font-family:Arial,Helvetica;font-size:12px;font-style:normal;font-weight:normal;text-align:center;line-height:100%;letter-spacing:normal;color:#ffffff;">
 <a href="{{ company['url'] }}" style="color:#ffffff;border:0px;outline:none;text-decoration:none;display:block;width:100%;height:20px">

{{ translation._('company.view.emailTemplatesCompaniesOfUser.go') }}

                </a>
               </p>   
            </td>
        </tr>
    
    </table>