响应式Html电子邮件模板

Question

我正在编写 html电子邮件，该电子邮件应该足以在所有移动设备中完美呈现。我是编写桌面电子邮件等方面的专家，这封电子邮件在所有电子邮件客户端和浏览器中都能完美呈现，但我必须让它非常适合手机。我的代码结构如下：

<table>
<tr>
 <td width="200"> <table>complete left table </table></td>
 <td width="200"> <table>complete middle table </table></td>
 <td width="200"> <table>complete right table </table></td>

</tr>
 </table>

为了让移动设备更好我知道我需要媒体查询但不知道使用它，有人可以参考我的相关教程可以帮助我做我的具体案例。请参阅附图，左侧是桌面，右侧是手机：

Answer 1

更新：此答案包含big list of email resources，包括响应式设计链接

以下是有关响应式设计的一些资源：

• Litmus responsive how to guide（滚动到底部）
• Campaign Monitor responsive guide

这是一个很好的模板，可以帮助您入门：

• Email on Acid's Responsive template