推薦12個創建響應式布局的優秀網格框架

　　在這篇文章中，我們為大家推薦12個創建響應式布局的優秀網格框架。如果網頁設計和開人員采用了正確的工具集，並基於一個靈活的網格架構，以及能夠把響應圖像應用到到設計之中，那么創建一個具備響應式的網站並不一定是一項艱巨的任務。enjoy!

您可能感興趣的相關文章

• Web 前端開發人員和設計師必讀文章集錦
• 十個擁有豐富 UI 組件的 JavaScript 框架
• 十款精心挑選的在線 CSS3 代碼生成工具
• 開發者必備的八個最佳雲端集成開發環境
• 2012年度最佳 Web 前端開發工具和框架

 

Pure

Pure 是一組輕量的，響應式的 CSS 模塊，您可以使用在任何的 Web 項目中。充分考慮了移動設備中的使用，保持文件體積盡量小，每行 CSS 都進行了仔細的考慮。Pure 基於 Normalize.css 構建，並提供布局以及 原生 HTML 元素的風格，加上最常見的 UI 組件。相信這些都是你需要的。

 

Tiny Fluid Grid

Tiny Fluid Grid 可以讓你定義網頁項目的網格系統。通過設置列，間距百分數以及最小、最大寬度，該應用可以給你生成可下載的 CSS 文件。

 

Variable Grid System

Variable Grid System 網格系統是一種快速的方法為您的網站生成一個基本的 CSS 網格。生成的 CSS 文件是基於960網格系統。

 

Mueller Grid System

MUELLER 是一個模塊化的網格系統，用於響應、自適應和非響應布局，基於 Compass 實現。您可以完全控制列的寬度，水槽的寬度，基線網格和媒體查詢。

 

GridSet

Gridset 讓你可以非常輕松的添加列，定義比例和設置間隔，而不用考慮背后的數學計算。網格系統正逐漸成為網頁設計的焦點，和印刷排版有點類似，但是要復雜很多。網頁的網格系統需要更加靈活，更加響應性。但是網格系統的計划和規划是件困難的事情，Gridset 可以讓你輕松的使用網格系統。

 

34 Grid System

34Grid 是一個響應式的網格系統，基於“平均分配列”布局。相對於其他的網格系統 ， 34Grid 給每一行提供均勻分布的列。 

 

dGrid

Dgrid 是下一代的網格組件，充分利用現代瀏覽器和對象存儲，輕量級，模塊化和易於擴展。

 

Zen Grids

Zen Grids 是基於 SASS 構建的一個響應式的網格系統。它通過去除最復雜的標記大大簡化了布局的創建，你只需要基於網格的設計，用純 CSS 和 HTML 創建你的響應式布局。 

 

Cute Grids

Cute Grids 是網格系統，為你的響應式設計提供了一個干凈的開始。這是移動優先，包括五個媒體查詢，並且是有詳細文檔。

 

Susy

Susy 是一個用於 Compass 的響應式網格系統。它可以讓你快速添加新的媒體查詢斷點到您的布局 。 

 

Grid Designer

Grid Designer 用於在線網格設計，有很多選項用於定義列，尺寸和間距。

 

The Grid

這是一個12列的靈活的網格，可以擴展到任意大小（由最大寬度的行定義）也很容易嵌套，這樣你就可以打造出復雜的布局，而無需創建大量的自定義元素。

 

您可能感興趣的相關文章

• 10套精美的免費網站后台管理系統模板
• 14個支持響應式設計的流行前端開發框架
• 60款很酷的 jQuery 幻燈片演示和下載
• 8個驚艷的 HTML5 和 JavaScript 特效
• 35款精致的 CSS3 和 HTML5 網頁模板

 

英文鏈接：50 Grid Tools for Responsive Web Designs

編譯來源：夢想天空 ◆ 關注前端開發技術 ◆ 分享網頁設計資源