Foundation6 网站

从原型到成品


下载 Foundation 6 查看下载选项

Foundation 6 让您的项目从原型到成品比以往任何时候都更有效!它包括了广泛的模块和灵活的组件。这些多功能就像轻便的积木,可以很容易地把你的想法实现。所有的代码片段支持ARIA属性和作用以及如何正确使用这些组件的说明。


减少50%的代码

规模仅 Foundation 5 的一半

所有的文件,包括组件和类现在是 60KB CSS & 84KB JS,如果删掉一些不需要的组件,空间还会更小。

A11y 友好

The Base for Fully Accessible Sites

所有的代码段带有 ARIA 属性和角色,以及如何使用它们的指引。

上传分享您的设计

设计代码

上传你设计的响应式网页,其他人可以在任何设备上注释和审查你上传的web页面。

灵活的导航模式

可定制的和模块化的导航

Modular JavaScript Utilities

Create Your Own JS Plugins

We reduced the amount of code in our JS plugins significantly by making each plugin smaller and creating more shared utility libraries. The utility libraries are publicly accessible so you can make your own amazing plugins.



Fewer Base Styles

The Styles You Need, None That You Don’t

The base styles act as a coded wireframe rather than a final design. Simpler CSS styles allow you to more easily modify them to fit your brand.

Motion UI

Easily Create Custom Animations and Transitions

Motion UI is our Sass based animation library that will help you add meaningful motion to your websites. This Sass library includes more than two dozen built-in transition and animation classes. It's very customizable and super easy to create your own with the Sass mixins.

Building Blocks & New Templates

A Growing Library of Resources.

We made some shiny new templates to kick off your next site or get some layout ideas. Pop these pre-made Building Blocks into your projects and save yourself time and resources.

Quick Project Starts

Spin Up Projects Faster Than Ever Before

Our new command line tool (CLI) lets you set up blank Foundation for Sites, Apps, or Emails projects with fewer dependencies than before. You can also install through NPM, Bower, Meteor, or Composer.

Optional Flexbox Grid

A Slick New Grid

For users who can embrace the newest of technology, Foundation comes with an optional Flexbox based grid. It’s the same grid you know and love, but with even better source ordering and alignment options.




Customizable Sass Grid

Any Combination of Columns You Need

The Sass grid mixins have been made smartly to give you even more flexibility to customize the grids with any number of columns. Four column grid inside a five column grid inside a twelve? Go for it!

ZURB Development Stack

Prototype with the tools ZURB uses

Use the same template that ZURB uses on all our client projects. This starter template is a souped up stack complete with a custom static site generator to help flatten files into single HTML documents. It compiles your Sass, gives you Handlebars templating, UglifyJS, UnCSS, and image compression.




Responsive Through & Through

We were the very first responsive framework and have been a friend to designers and developers around the world.

Semantic

Foundation can be used with completely semantic markup. Write clean code without sacrificing any utility or convenience.

Responsive

Foundation was the first responsive framework, and it permeates every aspect of the framework. Build for every device with ease.

Customizable

Foundation was built to be easily restyled. You can even customize the framework on download.

Faster

From the underlying code, to plugins, to everything around Foundation, we’ve built it to be faster than ever before.

Rails friendly

You can use Foundation with any back end, but it’s especially well-tuned for Rails implementations.

Readable

Foundation is written with humans in mind, and is easy to read even if you don’t know much code.

Mobile First

Foundation is built with small devices as a priority, and goes up from there.

Accessible

Foundation 6 is 508 compliant and more accessible than any previous version.

Sass

The premier CSS preprocessor is at the heart of Foundation.

Rapid prototyping

Foundation allows you to swiftly prototype your ideas so you can start testing sooner than later.

RTL Feature

Foundation supports right-to-left languages to help designers around the world design great products faster