Microsoft Outlook的样式按钮

时间:2014-10-28 22:51:30

标签: css outlook

我目前正在制作我的第一份时事通讯i Mailchimp。在查看不同电子邮件客户端的简报后,我可以看到我的"按钮"在Outlook中看起来不对。 下面是我的按钮代码;

<td align="center" valign="middle" bgcolor="#96d1eb" 
style="color: #ffffff; 
font-size: 13px; 
border-radius: 5px;
display: block; 
padding-right: 22px; 
padding-left: 22px; 
padding-bottom: 8px; 
padding-top: 8px; 
line-height: 22px; 
vertical-align: middle;" 
mc:edit="2">
<!--[if !mso]><!--><span style=" font-weight: normal;"><!--<![endif]-->
<a href="#" style="color: rgb(255, 255, 255); font-size: 13px;
text-decoration: none; line-height: 20px;" class="hover">Shop Now</a>
<!--[if !mso]><!--></span><!--<![endif]-->
</td> 

这在大多数电子邮件客户端中给出了以下结果;

enter image description here

虽然当我查看Outlook时,文本不是垂直居中且没有圆角;

enter image description here

如何让Outlook中的按钮与其他电子邮件客户端中的按钮相同?

1 个答案:

答案 0 :(得分:0)

...我建议将line-height设置为与font-size相同,并使用链接的padding来获得相同的结果。我确信这会导致这个问题。