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

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

 

Pure

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

 

Tiny Fluid Grid

 

Variable Grid System

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

 

Mueller Grid System

 

GridSet

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

 

34 Grid System

dGrid

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

 

Zen Grids

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

 

Cute Grids

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

 

Susy

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

 

Grid Designer

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

 

The Grid

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

 

您可能感興趣的相關文章

 

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

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