入门方法有两种

Foundation for Emails 可与纯 CSS 或 Sass 搭配使用。

CSS 版本

最快的入门方式!Foundation for Emails 的 CSS 版本配备了你需要的一切内容,还可以让你立即开始编写响应式 HTML 邮件。你可获取我们的样板 HTML、入门电子邮件模板以及经过实战考验的 Foundation for Emails CSS。

开始使用 CSS 版本
下载入门工具包

这些文件可在入门指南中使用。

Sass 版本

进一步精简你的工作流程。Foundation for Emails 的 Sass 版本让你对框架的可视样式拥有更多控制权。该版本还受到 ZURB Stack 的支持,ZURB Stack 是一个基于 Node 的构建系统,具有 HTML 模板、Sass 编译、图片压缩和内联功能。需要 Node.js 才能开始使用。

开始使用 Sass 版本
查看模板文件

这是你在入门指南中会用到的项目模板。



正在寻找 Ink 1.0?

Ink 1.0 不再受 ZURB 维护,但我们仍然保留了你使用该版本所需的所有文件,以及文档。此外,如果你想将项目升级到 Foundation for Emails 2,请查看我们的 迁移指南

下载 查看文档

名师课程用于响应式电子邮件

在这一在线课程中,你将学习如何快速设计和开发响应式电子邮件,让这些电子邮件在几乎所有屏幕、浏览器和电子邮件客户端(甚至 Outlook)中都表现得很出色。

学习 Foundation for Emails

获得 Foundation for Emails 认证电子邮件的五个步骤

按照这五个步骤,确保你的电子邮件看起来很出色。

1

下载样板

使用 基本样板 下载我们的 Foundation CSS。或者,如果你是 Sass 用户,请使用 Foundation CLI 安装 ZURB Email Stack。

2

编码你的电子邮件

使用 文档 建立网格,在需要的地方添加按钮和标注等组件。如果你刚上手,请按照 CSS 版本指南Sass 版本指南 进行操作。

3

将 CSS 内联到 HTML 中

一旦你的电子邮件看起来很出色,且包含了响应式样式,请将 CSS 内联到电子邮件中。我们的 Web 内联工具 可以轻松实现内联。或者,如果你正在使用 ZURB Email Stack,只需运行 npm run build

4

测试你的电子邮件

别急着发出去!确保在尽可能多的平台上对其进行测试。我们使用 Litmus 在多台设备上进行测试,而你也应该进行测试!

要查看受支持客户端的列表,请查看文档中的 兼容性页面

5

发出去!

电子邮件已准备就绪,可以发送!我们建议使用 MailchimpCampaign Monitor 等电子邮件服务提供商,因为当您发送电子邮件时,某些邮件客户端会删除响应式格式。

撰写出色邮件?请将副本发送给我们,地址为 [email protected]