Question

以下是我的HTML电子邮件的示例

<div style="width:650px;">
    <div class="begining">  
        <p>
            Dear <span>' . $name . '</span><br/>Thank you for your booking 
        </p>
    </div>

    <table border="1" style="width:80% ;margin: 10px auto;">
        <tr>
            <td>Confirmation Number: </td>
            <td>' . $id . '</td>
        </tr>
        <tr>
            <td>Client’s Name & Contact No:</td>
            <td>' . $name .' and ' . $mobile . '</td>
        </tr>
    </table>

    <div class="begining">  
        <p>
            Should you require an early delivery, 
            please call for your request as soon as possible.<br/>
            Sincerely,<br/>

            Johns<br/>

        </p>
    </div>
</div>

如果我希望我可以单独设置每个元素的样式，就像我为主div和表格所做的那样。但是我有很多像td和tr这样的表元素。我希望插入更多div。在每个div和其他元素中添加相同的样式将是令人厌倦的。所以我想添加样式表或将所有样式放在某处。我不知道在哪里。我尝试在样式表中为每个元素添加样式，但它不起作用，那么我现在该怎么办？提前致谢

Answer 1

您需要内联代码。即使它是多余的，您也可以简单地将内联CSS复制并粘贴到每个元素中。如果您需要批量更改许多内容，请在文本编辑器中使用search＆amp; replace。我也使用片段来防止我必须手动输入它。我个人觉得这比在做电子邮件时使用样式标签更容易，更快，因为它可以防止任何来回并帮助调试。

或者，你可以传统地使用样式标记（在标题中，而不是样式表），并在发送之前使用inliner tool将其转换为内联。

我强烈建议你check out this thread。它有很多关于html电子邮件中最佳实践的信息，应该有助于加快学习速度。

Answer 2

您不需要仅使用inline css。您可以使用class id设置div或任何元素的样式等

<div class="same"></div>

另一个分区

<div class="same"></div>

内部标签

<head>
<style>
.same
{
    /*some styling*/
}

</style>
</head>

通过这种方式，您可以为多个div，tr，th，td或任何使用class

提供连结

此链接将为您提供更多有用的提示 W3school css id class

Answer 3

之前的

<div style="width:650px;">

只需添加<style></style>元素即可。在里面你可以写类似的东西：

<style>
.begining {
color: red;
background: #999;
}
</style>

Answer 4

链接的CSS不起作用。 GMail，Outlook.com和AOL剥离了一切。外部css文件的链接显然不起作用。跳过div不是所有客户都理解它们。使用表格。

最佳实践是内联CSS。不要速记。

您可以使用CSS。但请务必使用Email on Acid和Litmus定期测试您的邮件。

如何设置HTML电子邮件的样式

4 个答案: