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

Question

我有一个简单的 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>

Answer 1

这是因为你有一个段落标签，它有字体 decleration:

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

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

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

<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>

这将确保您的段落与换行符保持一致，或者您可以使用 break 标签来模拟段落标签。我个人使用 break 标签来避免额外的代码。

希望以上内容能回答您的问题。