如何在电子邮件中发送的消息中创建按钮？答案

【问题标题】：How to create button in the message that is sent in the email?如何在电子邮件中发送的消息中创建按钮？
【发布时间】：2018-09-20 17:43:14
【问题描述】：

我在我的应用程序中开发了用户可以请求密码恢复的功能。他们需要做的就是输入电子邮件地址。系统会提供如下信息：

An email has been sent to example@gmail.com with further instructions.

然后在后端我首先检查系统中是否存在电子邮件。如果确实存在，我向用户发送了一封如下所示的电子邮件：

<div style="font-size:12px;font-family:Arial;font-weight:normal;">
    <br>We recieved a password reset request. The link to reset your password is below.<br>
    <br>If you did not make this request, you can ignore this email.<br>
    <br>Here is your password reset link: <a href="https://example.com/index.cfm?token=12453244">Click here</a> as soon as possible and change your password.<br>
</div>

在上面的电子邮件中，我想创建一个按钮，如果用户没有请求更改密码，该按钮将成为In Activate 链接的选项。我想知道如何以及在电子邮件中实现该功能的最佳方式是什么？

【问题讨论】：

In Activate 选项是什么？另外，为什么它需要是一个按钮，而不是一个链接 - 请记住，并非所有人都在支持 HTML 的客户端中查看电子邮件。
@vlaz 我已经解释了为什么，如果用户没有提出密码恢复请求（它是由其他人意外提交的），我们应该给他们一个选项来激活该链接。这意味着该链接将不再有效。此外，这个 html 只是我如何创建电子邮件内容的示例。用户只会看到文本而不是 HTML 代码。
所以In Activate 实际上应该是deactivate，对吗？除此之外，为什么不在一个小时或一天之内自动使链接失效呢？我从未见过让您手动使密码恢复链接过期的 Web 应用程序 - 它们只是在一段时间后无法使用。
@vlaz 我确实为链接设置了到期日期/时间。链接将在 30 分钟后失效。这更像是一个额外的安全选项。如果用户不提出该请求，为什么还要让链接再有效 30 分钟。在这种情况下，他们可能可以单击停用，链接将过期。希望这更有意义。
我访问过的大多数网站在目标页面本身都有该选项，而不是作为电子邮件本身的直接链接。但是，是什么阻止您创建另一个链接-单击时会执行您需要的任何停用代码-正如@vlaz建议的那样？如何选择使用 CSS 为链接“设置样式”（显示为链接、按钮等）取决于您...

标签： javascript html coldfusion html-email

【解决方案1】：

您可以使用内联 css 为您的标签设置样式，并使其看起来像一个按钮。

<a href='site.com/passwordRecovery' style='padding:1em; background-color:blue;color:white;display:block'>Click Me</a>

请记住，大多数电子邮件提供商（如 google 或 hotmail）都禁止使用 JavaScript 或外部 css。

【讨论】：

您的代码缺少显示块以使其成为块元素。电子邮件客户端在渲染 html 代码方面是臭名昭著的。也许从酸的电子邮件中给出防弹按钮的代码？