我正在将内联CSS样式应用到HTML邮件中，遇到了一个问题，当我发送测试邮件时，CSS样式部分工作。有人知道我如何解决这个问题吗？
重现步骤：
步骤1 -以内联方式将CSS样式应用于HTML（见下面的代码）。
<div class=" product-items" style="max-width: 600px;">
<div class="button-div" style="margin-bottom: 45px; text-align: center;">
<a href="#" style="background: #F26E11; padding: 13px 24px 14px; box-shadow: 16px 20px 10px rgba(0, 0, 0, 0.01), 9px 12px 9px rgba(0, 0, 0, 0.05), 4px 5px 6px rgba(0, 0, 0, 0.09), 1px 1px 4px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1); border-radius: 15px; margin: auto; color:#FFF; text-decoration: none;">
<span>Bestelling afmaken</span>
<span class="arrow-icon" style="background: #F9B788; border-radius: 50%; padding: 1px 3px;">
<img src="//app.squeezely.tech/uploads/prod/personalization/63c01436e8098.png">
</span>
</a>
</div>
<table align="center" class="mcnTable product-item" border="0" cellpadding="0" cellspacing="0" width="288" style="margin-top: 10px; background: #F9F9F9; box-shadow: 9px 22px 10px rgb(51 33 42 / 2%), 5px 13px 8px rgb(51 33 42 / 5%), 2px 6px 6px rgb(51 33 42 / 9%), 1px 1px 3px rgb(51 33 42 / 10%), 0px 0px 0px rgb(51 33 42 / 10%); border-radius: 10px;">结果：
它应该看起来像这样
但实际结果是
在chrome控制台上检查时，一些内联样式似乎被删除，例如：表格标签：
有谁能给我一些建议，告诉我如何才能解决这个问题？
1条答案
按热度按时间3pvhb19x1#
Gmail不支持
box-shadow（详细信息请参见Can I email）。默认情况下，它应该只删除box-shadow属性。但是对于<table>标记，您使用的是斜线符号（rgb(51 33 42 / 2%)）.这使得Gmail的解析器彻底崩溃，并删除了整个对应的内联style属性。（您可以read more about this specific issue here。）在这种情况下，不使用这种斜线表示法（最好使用十六进制颜色）会更安全。