Home >Web Front-end >HTML Tutorial >Recommended 12 excellent grid frameworks for creating responsive layout_html/css_WEB-ITnose

Recommended 12 excellent grid frameworks for creating responsive layout_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:54:321212browse

In this article, we recommend 12 excellent grid frameworks for creating responsive layouts. Creating a responsive website doesn’t have to be a daunting task if web designers and developers adopt the right toolset, build on a flexible grid architecture, and incorporate responsive images into the design. Task. enjoy!

Pure

Pure is a set of lightweight, responsive CSS modules that you can use In any Web project. Fully considered for use on mobile devices, the file size is kept as small as possible, and each line of CSS has been carefully considered. Pure is built on Normalize.css and provides layouts and styles for native HTML elements, plus the most common UI components. I believe these are all you need.

Tiny Fluid Grid

Tiny Fluid Grid allows you to define a grid system for web projects. By setting columns, spacing percentages, and minimum and maximum widths, the app generates downloadable CSS files for you.

Variable Grid System

Variable Grid System The Grid System is a quick way to generate a basic CSS grid for your website . The generated CSS files are based on the 960 grid system.

Mueller Grid System

MUELLER is a modular grid system for responsive, adaptive and non-responsive layouts, based on Compass accomplish. You have full control over column widths, gutter widths, baseline grid and media queries.

GridSet

Gridset allows you to easily add columns, define proportions and set intervals without thinking about it. The math behind it. The grid system is gradually becoming the focus of web design. It is somewhat similar to print layout, but it is much more complicated. The grid system of web pages needs to be more flexible and responsive. But the planning and planning of the grid system is a difficult thing. Gridset allows you to use the grid system easily.

34 Grid System

34Grid is a responsive grid system based on "evenly distributed columns" layout. Compared to other grid systems, 34Grid provides evenly spaced columns for each row.

dGrid

Dgrid is a next generation grid component that takes full advantage of modern browsers and object storage, is lightweight, modular and Easy to extend.

Zen Grids

Zen Grids is a responsive grid system built on SASS. It greatly simplifies the creation of layouts by removing the most complex markup and you only need grid-based designs to create your responsive layouts with pure CSS and HTML.

Cute Grids

Cute Grids is a grid system that provides a clean start for your responsive designs. It's mobile-first, includes five media queries, and is fully documented.

Susy

Susy is a responsive grid system for Compass. It allows you to quickly add new media query breakpoints to your layouts.

Grid Designer

Grid Designer is for online grid design with many options for defining columns, sizes and spacing.

The Grid

This is a 12-column flexible grid that can be expanded to any size (defined by the maximum width row) It’s also easy to nest, so you can create complex layouts without having to create tons of custom elements.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn