Outlook中的文本不使用行高

时间:2016-08-25 11:22:54

标签: css outlook html-email

我正在使用Html创建电子邮件,我偶然发现了Outlook 2010的问题。这是我的代码:

<td background="images/11-text-1--alpha-d3c29e.jpg" 
bgcolor="#d3c29e" width="514" height="460"  valign="top">        
    <!--[if gte mso 9]>
    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" 
    style="width:514px;height:460px;">
    <v:fill type="tile" src="images/11-text-1--alpha-d3c29e.jpg" color="d3c29e" />
    <v:textbox inset="0,0,0,0">
    <![endif]-->
        <p style="margin:0;padding:0;font-family:'Courier New',Courier,monospace;
        font-size:14px;font-weight:bold;color:#000000;line-height:15px;">
            #TEXT
        </p>
    <!--[if gte mso 9]>     </v:textbox>   </v:rect>   <![endif]-->
</td>

现在我想从文本中更改行高,但是当我在我的p标签中更改它时,它不会这样做,但是如果我把它放在td和/或MSO exeption中它也不会#39 ;为Outlook做的伎俩。有没有办法让这项工作,或者有人知道Outlook的解决方法吗?

2 个答案:

答案 0 :(得分:7)

您需要使用mso样式&#34; mso-line-height-rule&#34;。这用于强制Outlook遵守行高规则。请注意,这需要在声明的行高之前添加,否则将无效。见下文:

<td background="images/11-text-1--alpha-d3c29e.jpg" 
bgcolor="#d3c29e" width="514" height="460"  valign="top" style="margin:0;padding:0;font-family:'Courier New',Courier,monospace; font-size:14px;font-weight:bold;color:#000000;mso-line-height-rule:exactly; line-height:15px;">        
    <!--[if gte mso 9]>
    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" 
    style="width:514px;height:460px;">
    <v:fill type="tile" src="images/11-text-1--alpha-d3c29e.jpg" color="d3c29e" />
    <v:textbox inset="0,0,0,0">
    <![endif]-->   
            #TEXT
    <!--[if gte mso 9]>     </v:textbox>   </v:rect>   <![endif]-->
</td>

答案 1 :(得分:1)

首先,样式“p”标记已过期,而某些邮件客户端拒绝该标记(例如Outlook)。我以前遇到过这样的问题。

我建议你应该主要设置“td”标签的样式。如果您在此特定部分中有其他文本,请插入“span”标记,然后插入一些样式(但尝试不覆盖您在“td”标记中设置的样式。

在下面你有一个例子:

<td style="background-color: #2e3242;color:#ffffff; padding: 10px 0;
border-radius: 5px; font-size:15px; font-family: 'Trebuchet MS', sans-serif;
 line-height: 20px; text-align: center;width:28%; vertical-align: middle">
                                    Lorem Ipsum</td>

这里有一个跨度

<td width="548" style="color:#a8796b; font-size:14px; font-family: 'Trebuchet MS', 
sans-serif; line-height: 18px; text-align: center; 
width:548px; vertical-align: middle">
<span style="font-family: 'Trebuchet MS', sans-serif; font-weight: 300;
font-size: 16px;line-height: 30px;color:#a8796b">
Lorem Ipsum </span><br>
                                    Best Regards,<br>Lorem Ipsum
                                </td>