-2

我正在使用 Mailchimp 及其模板进行电子邮件营销。我添加了 Outlook 特定的 CSS 代码,但它仍然无法在 Outlook 中正确显示。有什么建议么?这是标题的一部分:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org      /TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>*|MC:SUBJECT|*</title>
    <style type="text/css">
        /* /\/\/\/\/\/\/\/\/ CLIENT-SPECIFIC STYLES /\/\/\/\/\/\/\/\/ */
        /** Outlook 07, 10 Padding issue: These "newer" versions of     Outlook add some padding around table cells potentially throwing off your perfectly pixeled table.  The issue can cause added space and also throw off borders completely.  Use this fix in your header or inline to safely fix your table woes.

More info: http://www.ianhoar.com/2008/04/29/outlook-2007-borders-and-1px-padding-on-table-cells/
http://www.campaignmonitor.com/blog/post/3392/1px-borders-padding-on-table-cells-in-outlook-07/

H/T @edmelly

Bring inline: No.
**/
table td {border-collapse: collapse !important}

        #outlook a{padding:0;} /* Force Outlook to provide a "view in browser" button      */
        .ReadMsgBody{width:600px;} .ExternalClass{width:600px;} /* Force Hotmail to display emails at full width */
        .yshortcuts, a .yshortcuts, a .yshortcuts:hover, a .yshortcuts:active, a .yshortcuts:focus{background-color:transparent !important; border:none !important; color:inherit !important;} /* Prevent Yahoo! from styling links */

        /* /\/\/\/\/\/\/\/\/ RESET STYLES /\/\/\/\/\/\/\/\/ */
        body{margin:0; padding:0;}
        img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
        table, td{border-collapse:collapse !important; mso-table-lspace:0pt; mso-table-rspace:0pt;}
        #bodyTable, #bodyCell{height:100% !important; margin:0; padding:0; width:100% !important;}
        #bodyCell{padding:10px;}
        .templateContainer{width:600px;}
4

2 回答 2

0

您可以将模板简化为更方便的模板,但这是我的 2c:

我建议您使用像石蕊这样的工具,这将允许您在任何电子邮件应用程序/浏览器/设备组合上测试营销电子邮件的呈现。

于 2013-09-17T11:46:37.310 回答
0

抱歉,您的电子邮件中到底有什么没有正确显示?尝试查看其他模板,例如http://zurb.com/playground/responsive-email-templates。它们应该让您更好地了解可靠的结构和 css。您需要内联您的 css,它是电子邮件通讯的标准 - 这是您获得一致外观的唯一方法,尤其是在 gmail 中!

于 2013-09-16T22:39:22.520 回答