0

我有一个内容表（我的用户的分数表），它会在每个预定的时间段内通过电子邮件自动发送出去。

html 曾经有静态表格大小和其他以像素为单位的测量定义，而不是百分比。

在我的 iPhone 和 chrome 网络浏览器上一切似乎都很好，但在 Android 设备上却完全不成比例。

我决定转换为响应式布局，用百分比替换那些。这似乎解决了我的问题，但现在，由于PC和移动设备宽\高比之间的宽度差异，我需要确定分数表到PC屏幕和移动\平板电脑屏幕的不同宽度。

我知道这可以通过使用@media 规则来完成，但问题是 CSS 的这个特性只能在样式表中使用，而不是在内联格式的 CSS（在 HTML 中）。您可能知道，大多数电子邮件客户端不允许在 HTML 电子邮件中使用 CSS 样式表（类、CSS 选择器）。

在这种情况下你会建议做什么？

非常感谢任何帮助。

4

2 回答 2

1

只是为了补充拉尔夫所说的......

截至去年，Gmail 成为最受欢迎的电子邮件客户端，它们从电子邮件中删除了整个部分。所以使用内联非常重要。

当您针对不同的电子邮件客户端时，这是一个很好的资源 http://www.campaignmonitor.com/css/

这些是我在每个头部样式部分中包含的一些有用的技巧

<style>
/* Force Outlook to provide a "view in browser" button. */
body{ width:100% !important; height:100% !important; margin:0; padding:0; background-color: #f8f3eb;}
.ReadMsgBody{width:100%;} 
.ExternalClass{width:100%;} /* Force Hotmail to display emails at full width */
/* Reset Styles */
body{-webkit-text-size-adjust:none; -ms-text-size-adjust:none;} /* Prevent Webkit and Windows Mobile platforms from changing default font sizes. */
</style>
于 2013-06-09T17:17:54.153 回答
1

大多数电子邮件客户端不允许在 HTML 电子邮件中使用 CSS 样式表（类、CSS 选择器）

没有链接样式表，但它们允许您将样式放置style在head. 是的，一些电子邮件客户端去掉了这些样式，但这不是不使用它们的理由。如今，许多电子邮件客户端也支持@media规则。关于这里的各种电子邮件客户端支持和不支持的内容，有很多很好的建议。（该网站还有大量经过良好测试且外观漂亮的电子邮件模板。）

由于某些电子邮件客户端不支持文档头部的样式，因此最安全的方法是添加内联样式。但是，这不应阻止您将样式（例如@media规则）放置在可以处理它们的客户端中。

于 2013-06-02T13:18:17.223 回答