0

在我正在做的电子邮件活动中，我遇到了一些关于 CSS 和内联样式的问题。

首先，我在使用@media css 时隐藏了元素（display:none;）以使它们以正确的顺序出现，因此我最终作弊了。这里的问题是在桌面 isp (gmail) 上显示时，它忽略了 (display:none;) 并最终在某些地方显示了双重内容。因此，我使用了双重内容消失（显示：无！重要；），然后影响了移动版本。

我在网上看到的一些移动模板似乎没有经过太多测试，因为它们根本无法跨多个邮件客户端工作。

如果有人有任何建议或帮助，代码就在这里http://www.makeyourownmarket.com/test/test-doc.html

4

3 回答 3

5

响应式电子邮件的一些提示：

  • 把你的!important声明放在你所有的@media only screen and (max-width: 480px)CSS上

  • 考虑解决方法，如果display:none;不起作用，请尝试使用内联 CSS，然后在您的移动样式中width:0;height:0;覆盖width:100px !important;height:100px !important;

  • 您将需要进行广泛的测试，最好为所有重要的电子邮件客户端拥有一个帐户/设备，但http://www.emailonacid.com工作在紧要关头。

于 2013-02-15T18:14:57.410 回答
4

我建议对 HTML 电子邮件及其局限性进行更多研究。

这篇文章是一个很好的起点： http: //kb.mailchimp.com/article/how-to-code-html-emails

一些技巧：

  • 不要将 CSS 放在 STYLE 标记中，因为这不适用于所有电子邮件客户端。
  • 仅使用内联 CSS
  • 使用表格进行布局
  • 如果媒体查询在电子邮件客户端中始终如一地工作，我会感到非常惊讶。我会避免尝试使用这些，而是​​专注于创建一个基本的、可靠的电子邮件模板，该模板在最流行的电子邮件客户端中始终如一地显示。
于 2013-02-15T10:27:12.873 回答
-2

我不认为响应式设计是电子邮件的正确方式。由于许多邮件客户端，通常在表格内发送电子邮件。你可以在这里找到更多相关信息

于 2013-02-15T10:29:00.440 回答