創建響應式布局的優秀網格工具集錦《系列五》


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

您可能感興趣的相關文章

 

Susy

susy

Susy is a responsive grid system for Compass. It lets you quick add new media-query breakpoints to your layouts, using their math or your own (with helpers).

 

GridSet

Gridset

Designing grids with Gridset is as easy as dragging guides in Photoshop or Fireworks. Gridset provides whatever you need: PNGs, a comprehensive cheat sheet and CSS.

 

Grid

Grid

Grid is a simple guide to responsive design. By following those simple steps, you are on the path to responsive web design mastery. Keep practicing and help make the web a better, more useable place.

 

Grid Designer

Grid Designer

This tool enables you to create a CSS Grid by specifying the number of columns and the widths of the columns, gutters and margins.

 

Blueprint Grid CSS Generator

Blueprint Grid CSS Generator

This tool will help you generate more flexible versions of Blueprint’s grid.css andcompressed.css and grid.png files. Whether you prefer 8, 10,16 or 24 columns in your design, this generator now enables you that flexibility with Blueprint.

 

The Grid System

The Grid System

The Grid System is an exceptional tool for creating responsive layouts.

 

Grid Displayer

Grid displayer bookmarklet

Grid Displayer is a boomarklet that displays the grid of both Twitter Bootstrap (fixed and fluid grid) and Foundation (2.0 and 3.0). It works with Firefox and WebKit browsers.

 

The Grid

The Grid

It’s a 12-column flexible grid that can scale out to an arbitrary size (defined by the max-width of the row) that’s also easily nested, so you can build out complicated layouts without creating a lot of custom elements.

 

您可能感興趣的相關文章

 

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

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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM