问题标签 [responsive-emails]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
55 浏览

html - 不同的字体大小和备用字体?

我正在使用 typekit 为我的电子邮件引入字体。显然这不适用于所有客户,所以我有一个后备。

如何为我的 typekit 字体和备用字体指定字体大小和其他样式?由于 typekit 字体开始时稍微大一些,我想改变它的大小。

0 投票
0 回答
26 浏览

html - HTML 电子邮件 - 将文本垂直居中对齐

我正在尝试垂直对齐 JS fiddle 中的文本,使其位于图像的中间。

我想使用表格,以便我可以控制它们在堆叠时对齐的位置。

我知道如果桌子是 TD 的,这是可能的

有任何想法吗?

https://jsfiddle.net/xfswnf2n/1/

0 投票
1 回答
210 浏览

mjml - 输出选项在 MJML 中不起作用

我已经编写了一个 gulp 任务来在更改时将 mjml 文件转换为 html。这是代码:

一切正常,但我希望输出扩展名是.phtml. 我使用输出选项,但它仍在生成.html扩展文件。

0 投票
1 回答
1789 浏览

html - iOS 渲染电子邮件的一半大小

问题

我在 Litmus 中测试了我的电子邮件,它仅在 iOS 手机中呈现电子邮件窗口大小的一半,如下所示。听起来 Apple 在 iOS 10 中进行了此更新,因此用户可以放大他们的电子邮件。我需要帮助才能在 iOS 手机上将响应式电子邮件呈现为全宽。

故障排除

当我删除所有 CSS 样式时,它会在手机上正确呈现(全宽)。但我需要电子邮件做出响应。

不适合我的在线解决方案

  1. 我在这里这里等几个地方在线看到了这个问题,解决方案就像在 <meta name="x-apple-disable-message-reformatting" />.
  2. <meta name="viewport" content="width=device-width, initial-scale=1.0" shrink-to-fit="no">
  3. 身体{宽度:100%;最大宽度:600px;}
  4. <body style="width: 100%; max-width: 600px;>
  5. 使用 max-width: 600px 将表格宽度设置为 100%;

这是我的代码

0 投票
2 回答
92 浏览

email - Outlook 不支持我的响应式电子邮件

我正在尝试制作响应式 html 电子邮件,所有电子邮件客户端都将支持哪个电子邮件。Outlook 不正确支持我的编码。我对这项工作了解不多。但我对此很感兴趣。为此,我需要专家的帮助。请从以下链接查看我的电子邮件编码:http: //htmlchecking.blogspot.com/2018/05/2-3-column.html

请帮助我,如何解决这个问题???

0 投票
1 回答
1146 浏览

html - 响应式电子邮件:移动端的反向块堆叠设计

所以问题的本质:我怎样才能让移动设备以相反的顺序堆叠块?几张插图:

全宽设计示例

全宽设计示例

移动设计示例和所需更改

移动设计示例和所需更改

我为这个东西使用了 mjml 电子邮件框架:

可以查看纯HTMLhttps://mjml.io/try-it-live/SJxb4Lo4m在右上角的“查看 HTML”选项卡中。

提前感谢您的帮助!

0 投票
1 回答
578 浏览

html-table - 如何为响应式电子邮件创建一个从 3x2 调整为 2x3 的流畅 html 表格?

我正在开发一个响应式电子邮件模板,我真的想要一个用于特色产品的表格布局,桌面版 3x2,移动版 2x3。

目前,我正在使用一个表格,其中的单元格更改为显示为移动客户端的内联块。但是,这在 Outlook 和 Thunderbird 中会中断,因为它们将所有单元格显示在一行中。我曾尝试浮动元素,但它们再次破裂。

表格网格 3x2 到 2x3

CSS

HTML

0 投票
1 回答
43 浏览

html - 如何让 p 标签在响应式电子邮件中从堆叠位置​​从左到右移动

我一直在创建响应式电子邮件,并且在桌面/移动更改方面遇到了一些问题。我希望桌面版本看起来像这样:

手机看起来像这样:

我已经尝试了几种方法,虽然它适用于我本地服务器上的 html 检查,但当我将测试电子邮件发送到客户端服务器时它不起作用。

代码片段显示了其中一个 div 部分的基本电子邮件模板,任何见解将不胜感激

0 投票
1 回答
1143 浏览

email-templates - 通过 MJML,如何创建带有嵌套列的响应式电子邮件模板?

MJML 中似乎没有办法嵌套 mj-column,那么如何创建嵌套列呢?

这就是我正在尝试构建的:

栏目截图

我也尝试使用 mj-section 和 mj-wrapper 但似乎这些标签都不能嵌套。

0 投票
1 回答
104 浏览

authentication - SendGrid 域认证 Heroku

我正在使用heroku,需要为sendgrid 验证域。但我不能这样做,因为 heroku 已经有像http://xyz.herokuapp.com这样的子域网址。任何人都可以提出更好的方法吗?