我需要建立一个响应的电子邮件模板。我做了我的研究，并了解到媒体查询不是广泛支持电子邮件客户端。
因此，我尝试不使用媒体查询，并使用display:inline-block堆叠列；最大宽度:290px；。
>
但是如果我想更改移动版本的字体大小怎么办？另外，我有一个案例，客户端希望很少的块是可见的，在移动，但不是在桌面。没有媒体查询，我如何实现这些？
另外，在我添加样式规则和媒体查询的情况下，我猜iOS支持媒体查询。但是媒体查询下的规则不会出现，但是中定义的其他规则可以正常工作。
模板看起来有点像这样：
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<style type="text/css">
table {
font-size: 24px;
}
#tdtoshowinmobile {
display: none;
}
@media only screen and max-device-width(767px){
table {
font-size: 32px !important;
}
#tdtoshowinmobile {
display: block !important;
}
}
</style>
</head>
<body>
<table>
...tr...td....
</table>
</body>
上面的模板将普通规则添加到内联元素中，但在我的例子中删除了媒体查询。我读过一篇文章，说邮件客户机删除样式标记并将其添加到内联元素中。我想，由于媒体查询不能内联定义，所以它们被忽略了。
因此，我的问题是：
>
如何在不使用媒体查询的情况下更改响应式电子邮件模板中的字体大小或颜色等？
如何以正确的方式添加媒体查询？（对我来说，在样式标记中添加它们不起作用）
1认为只能使用媒体查询来完成。
一些流行的移动邮件客户端支持媒体查询，所以在我看来这是值得的。
2希望这段代码能对您有所帮助
@media screen and (max-device-width: 767px),
screen and (max-width: 767px) {
}
另外，也许可以使用一些doctype
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
如果您寻找多列响应电子邮件示例，请看看石蕊或其他免费模板（这一个看起来真的很好作为示例）
