Gmail

Question

我的电子邮件模板有 class 用于 html elements 并且还在 table 中添加了 style 标签。 table 的 CSS 自定义是使用 class 选择器完成的。

在 Gmail 网络版中测试时，样式未应用，而且 classes 和样式在呈现的 DOM 中不可用。（虽然在 outlook 中工作正常）

是否有来自 Google 的文档表明他们将剥离 html classes 和样式标签？

此外，如果 Gmail 出现这种情况，请提出任何替代解决方案。请不要建议内联 css，因为我们使用 jsp 模板并且内容是动态呈现的。

样本html模板：

<table class="layoutTable">
   <tbody>
      <tr>
         <td class="layoutLeft" rowspan="3"></td>
         <td class="layoutTop"></td>
         <td class="layoutRight" rowspan="3"></td>
      </tr>
      <tr>
         <td class="layoutBody">
            <style type="text/css">BODY {
               FONT-SIZE: 70%; FONT-FAMILY: inherit; COLOR: #000000
               }
               TEXTAREA {
               FONT-SIZE: 70%; FONT-FAMILY: inherit; COLOR: #000000
               }
               BODY {
               FONT-SIZE: 14px; FONT-FAMILY: "Helvetica", Arial, sans-serif; PADDING-BOTTOM: 0px; TEXT-ALIGN: left; PADDING-TOP: 0px; PADDING-LEFT: 0px; MARGIN: 0px; PADDING-RIGHT: 0px; BACKGROUND-COLOR: #f8f8f8
               }
            </style>
            <table class="tableEmailText" cellspacing="0" cellpadding="0" border="0">
               <tbody>
                  <tr>

在 Gmail 中呈现 DOM：

<table>
   <tbody>
      <tr>
         <td rowspan="3">
         </td>
         <td>
         </td>
         <td rowspan="3">
         </td>
      </tr>
      <tr>
         <td>
            <table border="0" cellspacing="0" cellpadding="0">
               <tbody>
                  <tr>
                     <th>

Answer 1

Gmail 有不同的版本，但是是的，它经常被剥离嵌入 CSS。您必须重构代码以内联样式。参见 HTML email in Gmail - CSS style attribute removed Why is Gmail blocking CSS in emails? or Styles not working in Gmail

Gmail - HTML 类和 table 内的样式标签已删除

Gmail - HTML classes and style tags are removed inside table

html

email

html-email

email-templates