Sites 6 的基础

从原型到生产


下载 Foundation 6 查看下载选项

Sites 6 的基础设计,是为了让你的项目比以往任何时候都更有效率地从原型转向生产!它包括各种模块化、灵活的组件,并且可以轻松设置样式。这些多功能且重量轻的基本模块让你可以轻松实现你的想法。


减少 50% 的代码

Foundation 5 的一半大小

每个组件和类的总文件大小现在为 60KB CSS 和 84KB JS,在有选择地删除未使用组件后,还有很多空间让它们变得更小。

A11y 友好

完全无障碍网站的基础

所有代码段都带有 ARIA 特性和功能,以及有关如何正确使用这些组件的说明。这有助于确保在 Foundation 6 上构建的每个网站都可以在任何地方、任何设备上供任何人使用。

分享响应式原型

设计代码

将你的响应式设计网页上传,以获取在任何断点上的上下文反馈。利益相关者和协作者可以在任何设备上对编码后的网页进行注释和审阅。使用 Notable Code 将你的 Foundation 项目从原型转向生产。

灵活的导航模式

可定制和模块化的导航

我们创建了一个完全可定制和模块化的菜单系统。新的菜单组件是一个巨大的飞跃,因为它结合了几个组件,节省了许多代码行,并制作了可以在大多数项目中使用的模块化导航。

模块化 JavaScript 实用程序

创建你自己的 JS 插件

我们通过减小每个插件并创建更多共享实用程序库,大幅减少了 JS 插件中的代码量。实用程序库是公开可访问的,因此你可以制作自己惊人的插件。



更少的基准样式

你需要的样式,你不需要的都不需要

基准样式充当编码的线框,而不是最终设计。更简单的 CSS 样式让你更容易修改它们以适应你的品牌。

动作 UI

轻松创建自定义动画和过渡

动作 UI 是我们的基于 Sass 的动画库,它将帮助你为你的网站添加有意义的动作。此 Sass 库包含两个内置过渡和动画类。它非常可定制,并且使用 Sass 混合器也很容易创建你自己的库。

积木和新模板

不断发展的资源库。

我们制作了一些闪亮的全新 模板 来启动你的下一个网站或获取一些布局创意。将这些预制的 积木 放入你的项目中,节省时间和资源。

快速启动项目

比以往任何时候都更快地启动项目

我们新推出的命令行工具 (CLI) 只需极少的依赖项即可帮您设置 Foundation for Sites、Apps 或 Emails 空白项目。您还可以通过 NPM、Bower、Meteor 或 Composer 进行安装。

可选的 Flexbox 网格

一个精美的全新网格

对于能接受最新技术的用户,Foundation 提供了一个可选的基于 Flexbox 的网格。它是您熟悉且喜爱的网格,但拥有更好的源排序和对齐选项。




可定制的 Sass 网格

满足您需求的任意组合的列

Sass 网格混入被巧妙地制成,使您可以更灵活地使用任何数量的列来定制网格。在十二列网格内嵌套五列网格,然后在五列网格内嵌套四列网格?没问题!

ZURB 开发堆栈

使用 ZURB 使用的工具来进行原型制作

使用 ZURB 在我们所有客户端项目中使用的模板。这个启动模板是一个经过优化的堆栈,配有一个自定义静态网站生成器,可帮助将文件整理为单个 HTML 文档。它编译您的 Sass,提供 Handlebars 模板、UglifyJS、UnCSS 和图像压缩功能。




彻头彻尾地响应式

我们是第一个响应式框架,并且一直深受世界各地的设计师和开发者的喜爱。

语义

Foundation 可以与完全语义标记一起使用。撰写干净的代码,而无需牺牲任何实用程序或便利性。

响应式

Foundation 是第一个响应式框架,它渗透到框架的方方面面。轻松打造适用于所有设备的应用。

可定制

Foundation 构建为易于重新设置样式。您甚至可以在下载时自定义该框架。

更快速

从底层代码到插件,到 Foundation 周围的所有内容,我们已将其构建为比以往任何时候都更快。

Rails 友好

您可以将 Foundation 与任何后端一起使用,但它特别适合 Rails 实现。

可读

Foundation 基于用户思维,即使您不太懂代码,也易于阅读。

移动优先

Foundation 优先考虑小型设备,再从这里起步。

无障碍

Foundation 6 符合 508 标准,比任何以前版本更具无障碍性。

Sass

顶级 CSS 预处理器是 Foundation 的核心。

快速原型制作

Foundation 让您可以快速制作您想法的原型,以便及早开始测试。

RTL 特性

Foundation 支持从右到左的语言,帮助世界各地的设计师更快设计出优秀的产品