时间戳

首页 > 解决方案 > 如何在 Contact Form 7 中格式化不一致的电子邮件字体？

css - 如何在 Contact Form 7 中格式化不一致的电子邮件字体？

问题描述

我有一个简单的 Contact Form 7 表格，效果很好。我将它设置为 HTML 并有一些简单的格式，我将 p 标签设置为 Arial 和一些粗体。

所有的粗体都很好。大部分文本设置为 Arial。但是，如果消息有多行，它们会在后续行中恢复为 Times New Roman。

确保整个电子邮件（只是几个 p 标签）始终设置为正确的字体系列的正确方法是什么？我应该把它全部包装在一个跨度中吗？分区？HTML 电子邮件格式总是有点神秘。

例子：

<p style="font-family: Arial, Helvetica, sans-serif; font-size: 11pt;">
<b>To Department:</b> [_raw_department]
<b>From:</b> [your-name] <[your-email]>
<b>Company:</b> [corporate-name]
<b>Phone:</b> [phone]
</p>

<p style="font-family: Arial, Helvetica, sans-serif; font-size: 11pt;">
<b>Message Body:</b>
[your-message]
</p>

<p style="font-family: Arial, Helvetica, sans-serif; font-size: 11pt;">
-- 
This e-mail was sent from a contact form on ABC123 (http://www.abc123.com)
</p>

标签： cssfontshtml-emailinlinecontact-form-7

解决方案

这是因为您有一个具有字体声明的段落标签：

<p style="font-family: Arial, Helvetica, sans-serif; font-size: 11pt;">

如果您添加一个新的段落，它必须具有与其他段落标签相同的字体样式才能使其统一。

尝试使用表格作为具有字体声明的外包装，现在无论您创建多少个段落标签，您的字体都将保持不变。

<table>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size: 11pt;">

<p>
<b>To Department:</b> [_raw_department]
<b>From:</b> [your-name] <[your-email]>
<b>Company:</b> [corporate-name]
<b>Phone:</b> [phone]
</p>

<p>
<b>Message Body:</b>
[your-message]
</p>

<p style="font-family: Arial, Helvetica, sans-serif; font-size: 11pt;">
-- 
This e-mail was sent from a contact form on ABC123 (http://www.abc123.com)
</p>

</td>
</tr>
</table>

注意：不同的电子邮件客户端以不同的方式呈现段落边距。如果您使用段落，请将其用作：

<p style="font-weight:normal;margin:0;Margin:0px;padding:0px;"></p>

这将确保您的段落与换行符保持相同，或者您可以使用中断标记来模拟段落标记。就我个人而言，我使用中断标签来避免额外的代码。

希望以上回答你的问题。

推荐阅读