Gmail-在表格内删除了HTML类和样式标签 [英] Gmail - HTML classes and style tags are removed inside table

问题描述

我的电子邮件模板具有用于 html元素的类，并且还在表内添加了 style 标记。表格的CSS自定义是使用类选择器完成的。

My email template has classes for html elements and also style tag added inside table. And the CSS customization for the table is done using class selectors.

在Gmail网络版本中进行测试时，不会应用样式，在呈现的DOM中也无法使用这些类和样式。 （尽管在Outlook中效果很好）

When tested in Gmail web version the styles are not applied also the classes and styles are not available in the rendered DOM. (It works fine in outlook though)

是否有Google提供的文档来删除html类和样式标签？

如果Gmail属于这种情况，请提出其他替代解决方案。请不要建议内联CSS，因为我们使用 jsp 模板，并且内容会动态呈现。

Also if this is the case with Gmail please suggest any alternate solution. Please don't suggest inline css as we use jsp template and the contents are rendered dynamically.

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

推荐答案

Gmail有不同的版本，但是是的常见的是将其剥离嵌入式CSS。您必须重构代码以内联样式。请参阅 Gmail中的HTML电子邮件-删除了CSS样式属性 为什么Gmail会阻止电子邮件中的CSS？或样式无法在Gmail中使用

There are different versions of Gmail, but yes it is common to see it strip embedded CSS. You must refactor your code to inline the styles. See HTML email in Gmail - CSS style attribute removed Why is Gmail blocking CSS in emails? or Styles not working in Gmail

这篇关于Gmail-在表格内删除了HTML类和样式标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！