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

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

在查看repsonsive design html电子邮件时，我发现了一篇关于campaignmonitor的文章

它似乎将css@media查询和其他css混合在样式块中，而不是内联样式中，使用老式的表格布局

当然，如果电子邮件客户端能够处理css，那么它知道如何处理div？或者，该表只是作为那些仍然不能的人的后备方案？而媒体查询和阻止css对于那些这样做的人来说是额外的甜蜜吗

我意识到电子邮件客户端的变化不如web浏览器那么快，但表仍然是前进的最佳途径吗

我相信这个问题以前被问过很多次，但我在寻找现代趋势

---

也许这应该是另一个问题，但我也注意到这篇文章混合了element.class和element[class=“classname”]声明——我以前只在输入[type=“value”]中使用过最后一个声明。为什么要用方括号表示班级？

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

表的布局

我们还使用了
@media querys
和更复杂的样式，以便客户能够理解它们，但不幸的是，如果您想支持流行的邮件客户机，
表仍然是一条路要走。遗憾的是，如此多的商业客户使用旧的Outlook或类似的Outlook

工作完成后，我们正在使用测试布局，但这还不够，因此我们必须手动测试许多客户端

总结：如果我现在要编写电子邮件布局，我会选择表格和内联样式

编辑：括号表示法是正确的，但我看不出重点。此外，在本例中，它将仅与名为
classname
的类匹配元素。它将不匹配
。如果这里没有其他参数可以使用它，我会使用标准的点符号（
.classname
）。
应该注意的是，为了最大限度地兼容，您需要内联所有css。Campaignmonitor有一个工具可以为您自动内联，所以在阅读他们的建议时请记住这一点

css需要内联的原因是基于web的客户端，如gmail和（我想也是）yahoo去掉了样式声明（以及body标记之外的所有内容），以确保不会弄乱他们的网页。媒体查询无法内联，因此，尽管制作响应性电子邮件是当前的趋势，但请注意，它们在gmail中不起作用

仍然可以在表中工作，因为不同的电子邮件客户端存在不一致，特别是它们如何处理不同的css属性。电子邮件“停留在过去”的主要原因之一是Outlook使用MS Word渲染引擎。Outlook仍然是最受欢迎的电子邮件客户端，尤其是B2B

希望这些信息有帮助
 如果div确实不起作用，那么表本身就是一个保存备份。如果表格是标准元素，在每个浏览器中响应都不一样，div可以改变（想想边距/填充等），我认为选择表格更安全，尽管不要引用我的话。关于你的方括号问题，那要看情况而定。它可以用作验证，但是，我看不出它在这里是如何变化的。进一步说，这是一种合法的方式来指定某些内容，特别是某些内容，这意味着css只具体应用于该元素。括号可以用来避免Yahoo Mail倾向于使用响应版本的电子邮件样式，而不是内联表样式。我想表和向后兼容性就是这样。我猜竞选班长对html电子邮件略知一二。