我想用css样式表设置我的电子邮件模板设计
每个电子邮件地址都支持此功能,但Gmail不支持样式效果
这是我的代码。
<style>
p
{
margin-top:0px;
margin-bottom:0px;
line-height:20px;
}
.top
{
margin-top:15px;
}
#top
{
margin-top:25px;
}
.leftpadding
{
padding-left:25px;
}
#leftpadding
{
padding-left:45px;
}
</style>
<table width="50%">
<tr>
<td valign="middle">
<img src="home1.png">
</td>
<td valign="middle">
<span style="font-size:30px;float:right;">(Portal Name)</span>
</td>
</tr>
<tr>
<td colspan=2 style="font-family: Arial, Helvetica, sans-serif; font-size:16px; color:#000; line-height:10px; border-top:2px #0d5497 solid ">
<p>Dear Admin,</p>
<p class="top leftpadding">A new ticket has been created which needs your attention. </p>
<p class="top leftpadding">Ticket details are given below - </p>
<p class="top" id="leftpadding">Subject: $tickets.getSubject()</p>
<p id="leftpadding">Category: $categories.getCatagoriesName()</p>
<p id="leftpadding"> Status: $status </p>
<p id="leftpadding">Priority: $priority.getPriority_name() </p>
<p class="top leftpadding">You can check the status of or reply to this ticket online at:</p>
<p class="leftpadding"><a href="$customizationSettings.getBrandDomain()/helpdesk/customersupport/viewTicket.html?ticketId=$tickets.getTicket_id()">View Ticket </a></p>
<p id=top>Thank You,</p>
<p>Support Team,</p>
<p>$customizationSettings.getTitle()</p>
<a href=$customizationSettings.getWebsiteUrl() target="_blank" style="text-decoration:none;">
<span style="font-family:Myriad Pro; color:#0d5497; font-size:16px;">$customizationSettings.getWebsiteUrl()</span>
</a>
<td>
</tr>
</table>
有一种方法可以做这个内联样式表,但这是非常困难的,凝灰岩工作可以让任何人给我正确的方法吗?
答案 0 :(得分:1)
不幸的是,Gmail(以及大多数其他电子邮件客户端)不支持嵌入式css或样式标记。因此,您必须为每个元素使用内联样式。 你可以像
那样做<p style="margin-top:0px; margin-bottom:0px; line-height:20px;">
your content
</p>
答案 1 :(得分:1)
是的,这是唯一一种方法,因为许多基于Web的电子邮件客户端无法识别内部样式表。实际上,内联样式是设计html简报的推荐方法。
为所有内容使用内联样式。此站点会将您的类转换为内联样式:http://premailer.dialect.ca/
答案 2 :(得分:1)
你必须给css特别是Tag 请参阅代码
<span style="">
<p style=""> This is test......</p>
</span>