10个最好的响应式网页设计CSS框架

jopen 10年前

当今最受欢迎的响应式CSS框架是 推ter Bootstrap, Foundation, 和 Skeleton…。这篇文章将介绍一些最流行和最好的响应式CSS框架,您可以使用它来启动你的响应式网站项目。

推ter Bootstrap

10个最好的响应式网页设计CSS框架

Bootstrap is a popular, modern front-end/UI development framework. It’s feature-packed and will have most of the things you’ll need for developing responsive sites and apps.

Bootstrap has a 12-grid responsive layout, 13 custom jQuery plugins for common UIs like carousels and modal windows, a Bootstrap customizer, and more.

Bootstrap is well-documented, and this open source project has plenty of coverage in blogs and tutorial sites.

MORE / INFO DEMO

Foundation

10个最好的响应式网页设计CSS框架

Foundation is another popular responsive front-end framework. With this modern HTML5 framework, you can approach web design either mobile first, or from big displays down to mobile sizes.

It has rapid-prototyping capabilities, a responsive grid system and much more.

Foundation is by ZURB, a company of product designers focused on providing web-based solutions.

MORE / INFO DEMO

Skeleton

10个最好的响应式网页设计CSS框架

Skeleton is a simple and clean responsive CSS boilerplate for HTML5 websites and apps. It’s got just the things you need, and nothing more.

Some notable features: a responsive layout grid, standard media queries for your device-specific CSS style properties, a CSS class for responsive image elements that scale with the layout grid, a PSD template for mocking up your web designs, and an HTML5 shiv for old web browsers.

If you want to get started with responsive design quickly, you should look into this open source project.

MORE / INFO DEMO

HTML5 Boilerplate

10个最好的响应式网页设计CSS框架

In 2010, HTML5 Boilerplate became one of the first, and subsequently, most popular open source front-end web development tools for getting HTML5 websites and web apps up and running in no time. It’s a compilation web development solutions that enable our sites to support modern web browsers.

Included in HTML5 Boilerplate is a mobile-friendly HTML template, placeholder icons, CSS resets for normalizing/standardizing your stylesheet property values, standard media queries for popular viewing screens, an HTML5 shiv for non-modern web browsers, and more.

MORE / INFO DEMO

HTML KickStart

10个最好的响应式网页设计CSS框架

One of the newest kids on the block, HTML5 KickStart is a lean and mean package of HTML, CSS, and JavaScript files that promises to save UI developers hours of work.

At about 300KB, HTML KickStart packs quite a punch: UI components like stylish buttons and navigation bars, scalable icons (using Font Awesome), a responsive grid layout, a touch-enabled slideshow component and so on.

MORE / INFO DEMO

Montage HTML5 Framework

10个最好的响应式网页设计CSS框架

Montage is an open source HTML5 framework for building modern apps. This JavaScript library uses declarative binding which easily helps you keep your app data and UI in sync.

Montage also has a feature called Blueprints for associatively binding metadata onto your app objects — a pretty nifty function for dealing with lots of dynamic page elements.

MORE / INFO DEMO

SproutCore

10个最好的响应式网页设计CSS框架

SproutCore is a front-end framework for building HTML5 apps rapidly.

It follows the MVC architecture pattern and promises its users the ability to craft native-like user experiences for the Web.

MORE / INFO DEMO

Zebra

10个最好的响应式网页设计CSS框架

Zebra is a rich UI open source framework that leverages HTML5 canvas as the backbone of its rendering abilities.

Zebra says that using it “isn’t rocket science” and that you can get started in 5 minutes.

MORE / INFO DEMO

CreateJS

10个最好的响应式网页设计CSS框架

CreateJS is a suite of open source JavaScript libraries and tools for creating rich, interactive HTML5 content. It consists of 5 modular JavaScript libraries. It will help you with implementing animation effects, supporting HTML5 audio in your site, and much more.

Adobe, Microsoft, and AOL sponsor this project.

MORE / INFO DEMO

Less Framework

10个最好的响应式网页设计CSS框架

Less Framework is a modern front-end framework for building responsive designs. Similar to Skeleton (discussed above), Less Framework focuses on being just a plain and simple layout grid framework.

It has 4 pre-built layouts: Default, Tablet, Mobile and Wide Mobile.

MORE / INFO DEMO