支持移动和 Web 布局的 HTML 电子邮件模板框架

标签 html css email html-email

我需要创建 html 电子邮件群发,如果在网络和手机上打开,它的布局看起来会有所不同。所有消息来源都说我应该为此使用内联 CSS 和表格,因为像 gmail 这样的电子邮件客户端对外部 CSS 和资源非常严格。如何设计这个?

960 gs gris 系统在这里有用吗?有人用它来设计电子邮件模板吗?

谢谢, 已

最佳答案

我帮助了一位客户PostageApp创建适用于桌面和移动设备的电子邮件模板。在创建电子邮件布局时,请记住以下几点:

  • 电子邮件的宽度通常保持在 600 像素以内,以实现最佳的全面兼容性
  • 尽量不要使它的图像变重,因为这样很难缩放到较窄的宽度(手机!)
  • 尽量让所有内容都向左对齐,不要在一行中放置太多元素

它有点变化无常,我通过尽可能多地删除图像并将所有内容的大小减小到最多 300 像素宽(适合我的 iPhone)并通过将其发送到我的 iPhone 来不断测试它来获得最佳体验。

如果您希望它在网络和移动设备上都可见,我认为越简单越好。

关于支持移动和 Web 布局的 HTML 电子邮件模板框架,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8158671/

相关文章:

php - 将 header 添加到作为 Laravel 通知发送的电子邮件

css - 对齐表格中的图像

css - IE 背景图像具有透明度

javascript - Sitemesh 出现 ERR_CONTENT_LENGTH_MISMATCH 错误

jQuery Cycle2 - 淡出/淡出内容重叠问题

css - 具有“顶部:100%”的元素的高度为“0”?

java - 包含 Java 动态内容的电子邮件正文

javascript - 从正文中包含图像的 HTML 页面发送邮件

html - 在不中断文本流的情况下清除 IE7 中的 float

javascript - 如何使用php将PDF文件嵌入到iframe中