html-email 相关问题

有没有办法让按钮命令发送给 Gmail 或 Outlook 上的人？ （已编辑）

所以我从“联系我们”页面想到了这一点。 “按钮命令是否会发送给 Gmail 或 Outlook 上的人员？” 然后，我去了 Stack Overflow，搜索了“如何制作按钮命令

似乎无法使用 css 有效地格式化表格，因为某些选择器被忽略了

我有一个 Power Automate 流程，它使用 Monday.com 和 Microsoft Outlook 生成有关 monday.com 中新记录的表格 我有一个简单的流程，可以触发新记录并向...

电子邮件模板位置绝对？

在电子邮件模板中使用position:absolute是否安全？

Outlook 中圆形按钮的电子邮件 CSS，可控制暗模式颜色

此按钮使用记录完善的 VML 解决方案，可以在 Outlook 中呈现出色的效果，但仅限于轻型模式。在黑暗模式下，我失去了对“填充颜色”的控制，并得到了这个黑色的ove......

调整从 Excel 复制到 Outlook 电子邮件的范围图像的大小

我将 Excel 中的范围复制到 Outlook 电子邮件中。图像太小。 .Width 和.Height 不会改变图像。 将 OutApp2 调暗为对象 将 OutMail2 调暗为对象 Dim table2 作为范围 调暗 ws2 As

Outlook 电子邮件引擎正在添加额外的填充

我正在尝试创建一个 html 电子邮件模板，该模板在几乎所有客户端（除了 Outlook 桌面）中都可以正常工作。 我尝试了大部分与此相关的线程解决方案，但我无法找到...

如何在表格中间而不是顶部显示图像？

是关于这个模块的，我需要将图像显示在中间，而不是顶部 是关于这个模块的，我需要将图像显示在中间，而不是顶部<!-- D2 - BANNER - LIRT --><table align="center" bgcolor="#E4F4F4" cellpadding="0" cellspacing="0" class="container" role="presentation" style="background-color: #E4F4F4 !important;" width="600"> <tr> <td class="padding-lr_20"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="600"> <tr> <td align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="600"> <tr valign="bottom"> <td align="center"> <!--LEFT--><table align="left" border="0" cellpadding="0" cellspacing="0" class="container" width="300"> <tr> <td align="center" width="100%"> <a alias="Body-Image" conversion="false" data-linkto="https://" href="[link goes here]" style="color: #000000; font-family: sans-serif;text-align: center; text-decoration: none; display: block;"><img alt="[add alt text here]" class="content-image" src="https://dummyimage.com/300x100" style="display: block;width:100%" width="300"> </a></td></tr></table><!--//LEFT--><!--[if gte mso]> </td> <td valign="top"> <![endif]--><!--RIGHT--><table align="right" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="300"> <tr valign="middle"> <td align="center" class="padding-tp_20 padding-lr_0" style="padding: 0 32px;" width="265"> <!--[if mso]> <div style="padding-top:20px;"></div> <![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center" class="h1 text-center" style="font-family: sans-serif;font-size: 26px;line-height: 30px;color: #000000;font-weight: 700;letter-spacing: -.02em; text-align:left;"> Text Text Text Text Text Text </td></tr><tr> <td align="center" class="body_text text-center" style="font-family: sans-serif;font-size: 16px;line-height: 22px;color: #000000;font-weight: 400; text-align:left;padding-top: 20px;padding-bottom: 20px;"> Text Text Text Text Text Text Text Text Text </td></tr></table></td></tr></table><!--//RIGHT--></td></tr></table></td></tr></table></td></tr></table></td></tr></table><table align="center" bgcolor="#ffffff" cellpadding="0" cellspacing="0" class="container" role="presentation" style="background-color: #ffffff !important;" width="600"> <tr> <td style="padding-top: 40px;"> </td></tr></table><!-- //D2 - BANNER - LIRT --> 我需要将图像垂直居中。我尝试在 TR 标签上添加 valign="middle"，但没有成功。 要通过图像实现您所需要的效果，只需进行一个小修复即可。 <!-- ... [earlier code] ... --> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="600"> <tr> <td align="center" valign="middle"> <!-- valign="middle" added here --> <!--LEFT--> <table align="left" border="0" cellpadding="0" cellspacing="0" class="container" width="300"> <tr> <td align="center" valign="middle" width="100%"> <!-- valign="middle" added here --> <a alias="Body-Image" conversion="false" data-linkto="https://" href="[link goes here]" style="color: #000000; font-family: sans-serif;text-align: center; text-decoration: none; display: block;"> <img alt="[add alt text here]" class="content-image" src="https://dummyimage.com/300x100" style="display: block;width:100%" width="300"> </a> </td> </tr> </table> <!--//LEFT--> <!-- [rest of your code] ... --> </td> </tr> </table> <!-- ... [later code] ... --> 如果你想让图像垂直居中，可以使用CSS Flexbox <!-- D2 - BANNER - LIRT --> <table align="center" bgcolor="#E4F4F4" cellpadding="0" cellspacing="0" class="container" role="presentation" style="background-color: #E4F4F4 !important;" width="600"> <tr> <td class="padding-lr_20"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="600"> <tr> <td align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="600"> <tr valign="bottom"> <td align="center" style="display: flex; align-items: center;"> <!--LEFT--> <table align="left" border="0" cellpadding="0" cellspacing="0" class="container" width="300"> <tr> <td align="center" width="100%"> <a alias="Body-Image" conversion="false" data-linkto="https://" href="[link goes here]" style="color: #000000; font-family: sans-serif;text-align: center; text-decoration: none; display: block;"> <img alt="[add alt text here]" class="content-image" src="https://dummyimage.com/300x100" style="display: block;width:100%" width="300"> </a> </td> </tr> </table> <!--//LEFT--> <!--[if gte mso]> </td> <td valign="top"> <![endif]--> <!--RIGHT--> <table align="right" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="300"> <tr valign="middle"> <td align="center" class="padding-tp_20 padding-lr_0" style="padding: 0 32px;" width="265"> <!--[if mso]> <div style="padding-top:20px;"></div> <![endif]--> <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center" class="h1 text-center" style="font-family: sans-serif;font-size: 26px;line-height: 30px;color: #000000;font-weight: 700;letter-spacing: -.02em; text-align:left;"> Text Text Text Text Text Text </td> </tr> <tr> <td align="center" class="body_text text-center" style="font-family: sans-serif;font-size: 16px;line-height: 22px;color: #000000;font-weight: 400; text-align:left;padding-top: 20px;padding-bottom: 20px;"> Text Text Text Text Text Text Text Text Text </td> </tr> </table> </td> </tr> </table> <!--//RIGHT--> </td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </td> </tr> </table> <table align="center" bgcolor="#ffffff" cellpadding="0" cellspacing="0" class="container" role="presentation" style="background-color: #ffffff !important;" width="600"> <tr> <td style="padding-top: 40px;"></td> </tr> </table> <!-- //D2 - BANNER - LIRT --> 我添加到您的代码中的是style="display: flex; align-items: center;"到td。 要使用 HTML 获得所需内容，您需要将 valign="middle" （如 andrewbyteforge 指出的那样）和 height="300" 设置为包含图像的 <td>。您的原始 HTML 有 <td align="center" width="100%">，但它需要是 <td align="center" valign="middle" width="100%" height="300">。我希望这有帮助。 <!-- D2 - BANNER - LIRT --><table align="center" bgcolor="#E4F4F4" cellpadding="0" cellspacing="0" class="container" role="presentation" style="background-color: #E4F4F4 !important;" width="600"> <tr> <td class="padding-lr_20"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="600"> <tr> <td align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="600"> <tr valign="bottom"> <td align="center"> <!--LEFT--><table align="left" border="0" cellpadding="0" cellspacing="0" class="container" width="300"> <tr> <td align="center" valign="middle" width="100%" height="300"> <a alias="Body-Image" conversion="false" data-linkto="https://" href="[link goes here]" style="color: #000000; font-family: sans-serif;text-align: center; text-decoration: none; display: block;"><img alt="[add alt text here]" class="content-image" src="https://dummyimage.com/300x100" style="display: block;width:100%" width="300"> </a></td></tr></table><!--//LEFT--><!--[if gte mso]> </td> <td valign="top"> <![endif]--><!--RIGHT--><table align="right" border="0" cellpadding="0" cellspacing="0" class="container h-auto" height="300" width="300"> <tr valign="middle"> <td align="center" class="padding-tp_20 padding-lr_0" style="padding: 0 32px;" width="265"> <!--[if mso]> <div style="padding-top:20px;"></div> <![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td align="center" class="h1 text-center" style="font-family: sans-serif;font-size: 26px;line-height: 30px;color: #000000;font-weight: 700;letter-spacing: -.02em; text-align:left;"> Text Text Text Text Text Text </td></tr><tr> <td align="center" class="body_text text-center" style="font-family: sans-serif;font-size: 16px;line-height: 22px;color: #000000;font-weight: 400; text-align:left;padding-top: 20px;padding-bottom: 20px;"> Text Text Text Text Text Text Text Text Text </td></tr></table></td></tr></table><!--//RIGHT--></td></tr></table></td></tr></table></td></tr></table></td></tr></table><table align="center" bgcolor="#ffffff" cellpadding="0" cellspacing="0" class="container" role="presentation" style="background-color: #ffffff !important;" width="600"> <tr> <td style="padding-top: 40px;"> </td></tr></table><!-- //D2 - BANNER - LIRT --> 如果不设置高度，就没有“中间”，它会根据其内容（本例中的图像）全部折叠，并且它只是位于其父级的顶部<td>。

边框半径在 Outlook 桌面上不起作用

使按钮变圆的边框半径在 Outlook 桌面版中不起作用。 这是我在 html 中尝试的代码 使按钮变圆的边框半径在 Outlook 桌面版中不起作用。 这是我在 html 中尝试的代码 <table border="0" cellspacing="0" cellpadding="10" valign="top"> <tr> <td class="outlook-btn" align="center" style="font-size:18px; background-color:#FFFFFF;"> <font face="Arial, sans-serif"> <a href="#" style="padding: 10px 25px; border-radius:5px; color:#df0024; text-decoration:none;">GET STARTED</a> </font> </td> </tr> </table> 展望有条件评论 .outlook-btn{ padding: 10px 25px !important; border-radius: 20px !important; border: 1px solid #000000 !important; } 自 2007 年起，Windows 上的 Outlook 使用 Word 作为渲染引擎。该引擎自 2007 年以来就没有真正更新过，因此它不支持此后出现的任何 HTML 或 CSS。所以它不支持border-radius。 （您可以查看 CanIEmail.com，了解有关 Outlook 和其他电子邮件客户端中 CSS 支持的详细信息：https://www.caniemail.com/features/css-border-radius/）。 在 Windows 上的 Outlook 中获得圆角的常见解决方案是使用 VML。它是一种类似于 SVG 的图像格式。 Campaign Monitor 有一个按钮生成器，该按钮生成器使用 VML for Outlook on Windows：https://buttons.cm/（但请注意，VML 可能会对可访问性产生负面影响，例如使 VML 中的链接对键盘用户不可用。）

为什么 Outlook 会丢失从 SQL 发送的电子邮件的 HTML 格式？

我有一封在 SQL Server Management Studio 中创建的电子邮件，其正文为 HTML。在 HTML 中，我使用 CSS 来更改表中某些行的背景颜色。当我查看 HTML 时，它看起来很好；

在 Gmail 中添加内嵌图像显示为附件

我正在尝试在应用程序脚本中发送的电子邮件中添加标题图像。在我的应用程序脚本中，我有以下内容： 让图像 = DriveApp.getFileById("10iAyjrAeTBOBTuqGmAv_SmbuUvhR8NYL").getAs(&...

电子邮件 HTML：如何将 2 个按钮排列成一行，但让它们拉伸到容器的完整大小？

我布局了 html 字母，一切都很顺利，直到我需要在一行中放置两个不同大小的按钮并跨越内容的宽度。试了半天才解决这个问题...

我是前端菜鸟，所以通过邮件发送时自动生成的html页面没有正确呈现，它在实时服务器中正常运行

这是在实时服务器上渲染时的样子 当自动响应被触发时它会被扭曲 模板正在通过邮递员发送 注意：- '这是用'内联css'编写的原因

Outlook Web 忽略样式

该代码适用于 Gmail 和 Outlook，但是当我使用 Outlook Web 版本（Outlook.com Edge、Windows 10）检查该按钮时，根本没有样式并且 [if mso] 条件语句...

雅虎邮件的 css 解析器从 html 中删除框大小，如何解决这个问题？

尝试设计 HTML 邮件，但在雅虎测试时我发现它从 HTML 中删除了所有框大小样式。 有什么办法可以解决这个问题吗？

如何将我的申请输出嵌入到合作伙伴电子邮件中？

我开发了一个应用程序，目前通过 iframe 提供，以便合作伙伴可以将其嵌入到他们的网站中。其中一些合作伙伴对类似的电子邮件体验感兴趣。 有没有

我正在将图像从 Excel 复制到 Outlook VBA 中。唯一的问题是图像太小并且似乎没有任何效果

调暗 OutApp2 作为对象 将 OutMail2 调暗为对象 Dim table2 作为范围 Dim ws2 作为工作表 Dim tableoosinst 作为范围 调暗 pic2 作为图片 昏暗的WordDoc2 设置 OutApp2 = CreateObject("Outlook.

嵌入式 html 对于某些用户来说无法按预期工作，而对于 Outlook 中的某些用户来说则无法工作

我们在 html 中添加了一个 Anchor 标签，并将其设置为一个按钮。单击该新草稿邮件即可打开，我们仅在该标签中添加了 mailto、加密主题和电子邮件正文。 是

HTML 电子邮件中的字体颜色 - Gmail

我知道我必须使用内联 CSS 来设计 HTML 电子邮件中的任何内容，但我注意到 gmail 中发生了奇怪的覆盖。我正在尝试更改表行中文本的颜色： <...

时事通讯的圆形按钮在 MS 邮件中不起作用

我需要为时事通讯制作一个圆形按钮，HTML代码插入到用于时事通讯的网络基础工具中 大部分内容都可以，但 Windows 10 上有一个带圆角的黄色按钮...

在 iOS 中调整 HTML 电子邮件内容大小

我有一个java应用程序，它发送使用百里香模板构建的每日电子邮件摘要。电子邮件在大多数环境中都能正确呈现。唯一似乎有问题的地方是 n...