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

標籤：des   blog   http   io   ar   使用   java   sp   for   

　　在這篇文章中，我們為大家推薦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 是下一代的網格組件，充分利用現代瀏覽器和Object Storage Service，輕量級，模組化和易於擴充。

 

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

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

本文來自【夢想天空（http://www.cnblogs.com/lhb25/）】

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