如何用 HTML 编写电子邮件并使用 Gmail 发送？

在本文中，我们将了解用户如何编写 HTML 格式的电子邮件并使用 Gmail 发送。但是，Gmail 不提供 HTML 编辑器，我们仍然可以使用一些工具和方法在电子邮件中发送 HTML 模板。许多人需要向其他人发送带有 HTML 模板的电子邮件。通过使用以下方法，用户将能够使用 Gmail 发送 HTML 格式的电子邮件。他们不需要使用 Mailchimp 等第三方工具。

使用 Gmail 发送 HTML 格式的电子邮件有 3 种方法。

将网页中的 HTML 复制并粘贴到 Gmail 编辑器。
通过使用 chrome 的开发者工具。
通过使用 Chrome 扩展程序。

方法 1：将网页中的 HTML 复制并粘贴到 Gmail 编辑器

Gmail 提供了“所见即所得”的编辑器。如果我们将原始 HTML 代码粘贴到编辑器中，接收者也会看到相同的原始 HTML 代码。因此，我们需要从网络浏览器复制 HTML 代码输出并将其粘贴到 Gmail 编辑器中，而不是添加原始 HTML。以下步骤将帮助您生成 HTML 格式的电子邮件。

第 1 步：创建一个新的 HTML 文件并将以下 HTML 代码添加到其中。

HTML



  

    Simple HTML webPage

  

    Welcome to GeeksforGeeks
     
A computer science portal for geeks

第 2 步：在 Web 浏览器中打开 HTML 文件并从那里复制 HTML。

第 3 步：将 HTML 粘贴到 Gmail 编辑器中。

第 4 步：像从 Gmail 中正常发送电子邮件一样发送电子邮件。

方法二：使用chrome的开发者工具

Chrome 的开发者工具允许用户编辑网页的代码。在这里，我们将找到 Gmail 编辑器的相关元素并将 HTML 代码添加到其中。用户需要按照以下步骤使用此方法。

第 1 步：打开 Gmail 编辑器并右键单击编辑器内的任意位置。

第 2 步：从菜单中，单击检查选项。您将看到 chrome 的开发人员工具已打开，并且 Gmail 编辑器的 HTML 代码。

第三步：用户需要找到带有“ contenteditable=true ”标记的div元素。右键单击 div 元素并选择edit as an HTML 。

第 4 步：从 div 元素中删除代码并添加您的 HTML 模板代码。

第 5 步：现在，关闭 chrome 的开发者工具，您可以看到 HTML 已添加到 Gmail 编辑器中。

方法3：使用chrome扩展

我们将使用“ Gmail 的 Html 插入器” chrome 扩展以直接在 Gmail 编辑器中编写 HTML 代码。我们只需要在 chrome 浏览器中添加一个 chrome 扩展，Gmail 就会自动显示编写 HTML 代码的选项。要实现此方法，请按照以下步骤操作。

第 1 步：从此处将Gmail chrome 扩展的 Html 插入器添加到 chrome 浏览器。

第 2 步：单击发送按钮旁边的 HTML 图标。

第 3 步：在此处添加 HTML 代码。

第 4 步：单击“插入 HTML ”按钮，我们就完成了。

注意：当您发送带有 HTML 模板的电子邮件时，您不应添加带有外部 CSS 文件的 CSS 和 Web 字体。此外，您只能在 HTML 模板中使用在线托管和公开可用的图像。

输出：

以上 3 种方法都将给出与下图相同的结果。现在，用户可以将这个 HTML 模板像简单的电子邮件一样发送给任何人。