Gmail 的 html 电子邮件中 table 的内联样式并使用 PHPMailer 发送

Question

我在这上面花了很多时间，但我仍然很困惑！

目标：将样式（内联）应用到 table、td、th、p、使用 PHPMailer 发送的 html Gmail 电子邮件中的元素。

问题：内联样式未显示

HTML代码：

<section id="email">
    <table cellspacing="0" cellpadding="25" border="10" style="font-family: Arial, sans-serif; text-align: center;">
    <tbody>
        <tr>
            <th style="border: 1px solid rgb(255, 0, 0);">A</th>
            <th style="border: 1px solid rgb(255, 0, 0);">B</th>
            <th style="border: 1px solid rgb(255, 0, 0);">C</th>
            <th style="border: 1px solid rgb(255, 0, 0);">D</th>
        </tr>
        <tr>
            <td style="border: 1px solid rgb(255, 0, 0);">red</td>
            <td style="border: 1px solid rgb(255, 0, 0);">100</td>
            <td style="border: 1px solid rgb(255, 0, 0);">120</td>
            <td style="border: 1px solid rgb(255, 0, 0);">45</td>
        </tr>
        <tr>
            <td style="border: 1px solid rgb(255, 0, 0);">blue</td>
            <td style="border: 1px solid rgb(255, 0, 0);">50</td>
            <td style="border: 1px solid rgb(255, 0, 0);">250</td>
            <td style="border: 1px solid rgb(255, 0, 0);">35</td>
        </tr>
        <tr>
            <td style="border: 1px solid rgb(255, 0, 0);">green</td>
            <td style="border: 1px solid rgb(255, 0, 0);">65</td>
            <td style="border: 1px solid rgb(255, 0, 0);">180</td>
            <td style="border: 1px solid rgb(255, 0, 0);">360</td>
        </tr>
    </tbody>
    </table>
<p style="color:#FF0000;font-weight: bold;">I want this text to be bold and red!</p></section>

JS代码：

var data = {
    to:"test@gmail.com",
    from:"<my@email.com>",
    fromName:"me",
    subject:"test html email",
    message: $("#email").html()
};

$.ajax({
    type: "POST",
    url: "email.php",
    data: data,
    success: function(){
        alert("email sent");
    }
});

email.php代码：

<?php
require '../PHPMailer-5.2.9/PHPMailerAutoload.php';

if($_POST){
    $mail = new PHPMailer;
    $mail->From = $_POST['from'];
    $mail->FromName = $_POST['fromName'];
    $mail->addAddress($_POST['to']);     
    $mail->Subject = $_POST['subject'];
    $mail->Body    = $_POST['message'];
    $mail->AltBody = $_POST['messageAlt'];

    $mail->isHTML(true);
    $mail->send();
}
?>

我确实在 Gmail 中收到了包含所有数据的电子邮件。但是，html 中的内联样式被完全忽略。

提前感谢所有花时间回复的人！

Answer 1

好的，我想通了！

我的 PHP 代码有问题。 HTML 字符串需要去除反斜杠。首先，我将消息存储在 $body 变量中，用 "stripslashes($body)" 去除斜线，然后通过 "MsgHTML($body)" 将 $body 附加到 $mail。

这里是修改后的 PHP:

<?php
require '../PHPMailer-5.2.9/PHPMailerAutoload.php';

if($_POST){
    $mail = new PHPMailer;
    $body = $_POST['message'];
    $body = stripslashes($body);

    $mail->From = $_POST['from'];
    $mail->FromName = $_POST['fromName'];
    $mail->addAddress($_POST['to']);     
    $mail->Subject = $_POST['subject'];
    $mail->MsgHTML($body);
    $mail->AltBody = "Alternate Content";   
    $mail->isHTML(true);

    $mail->send();
?>

Gmail 的 html 电子邮件中 table 的内联样式并使用 PHPMailer 发送

Inline styles for table in html email for Gmail and sending with PHPMailer

html

javascript

css

php

email

Gmail 的 html 电子邮件中 ​​table 的内联样式并使用 PHPMailer 发送

Inline styles for table in html email for Gmail and sending with PHPMailer

html

javascript

css

php

email

Gmail 的 html 电子邮件中 table 的内联样式并使用 PHPMailer 发送