html - 2012 html 电子邮件 - 表格、div 和@media

Question

html 电子邮件的当前趋势是什么？

研究我遇到的响应式设计 html 电子邮件 this关于 campaignmonitor 的文章。

它似乎在样式 block 中混合了 css @media 查询和其他 css 而不是内联样式，以及旧式表格布局。

当然，如果电子邮件客户端能够处理 css，它就知道如何处理 div？还是该表只是那些仍然不能的人的后备？媒体查询和阻止 css 对那些这样做的人有额外的好处吗？

我意识到电子邮件客户端的变化不如网络浏览器那么快，但表格仍然是最好的前进方式吗？

我敢肯定这个问题以前已经被问过很多次了，但我正在寻找现代趋势。

也许这应该是另一个问题，但我也注意到这篇文章混合了 element.class 和 element[class="classname"] 声明 - 最后一个我只用过 input[type="value"] 前。为什么要用方括号表示类？

Answer 1

最近我的公司正在改变他们的电子邮件布局。首先，我们决定测试不同电子邮件客户端与最新 html/css 标准的兼容性。然而，在编码过程中，我们遇到了许多正确渲染的问题，这迫使我们返回到 table。基于布局。

我们还使用了 @media-queries以及为能够理解它们的客户提供更复杂的样式，但不幸的是tables如果您想支持流行的邮件客户端，仍然是可行的方法。遗憾的是，这么多企业客户使用旧版 Outlook 或类似软件。

工作完成后，我们正在使用 Campaign Monitor Tester 测试我们的布局但这还不够，所以我们不得不手动测试许多客户端。

总结:如果我现在要编写电子邮件布局代码，我会使用表格和内联样式。

编辑:括号符号是正确的，但我不明白这一点。此外，在此示例中，它只会匹配具有一个名为 classname 的类的元素。 .它不会匹配 <p class="classname othername"> .如果这里没有其他理由支持使用它，我会使用标准点符号 ( .classname )。