Generador de plantilla de columnas para web

The 1Kb CSS Grid es una online que permite generar frameworks o estructuras de ficheros con el encolumnado ya creado bajo HTML y CSS. Ideal para realizar , mockups y todo tipo de pruebas.

Para configurar tu parrilla dispones de tres deslizadores desde donde debes configurar una parrilla imaginaria de columnas para dar forma a las capas de tu .

El resultado te lo descargas en un fichero zipeado: Si abres el html te encontrás una plantilla como la siguiente:

El código que te genera es muy limpio. Únicamente dos archivos, un HTML y un CSS.

En nuestras pruebas hemos obtenido el siguiente código HTML

	



The 1Kb Grid Demo – 9 columns, 80 pixels each, with 20 pixel gutter




9

6

3

3

3

y el siguiente CSS

.grid_1 { width:80px; }
.grid_2 { width:180px; }
.grid_3 { width:280px; }
.grid_4 { width:380px; }
.grid_5 { width:480px; }
.grid_6 { width:580px; }
.grid_7 { width:680px; }
.grid_8 { width:780px; }
.grid_9 { width:880px; }

.column {
margin: 0 10px;
overflow: hidden;
float: left;
display: inline;
}
.row {
width: 900px;
margin: 0 auto;
overflow: hidden;
}
.row .row {
margin: 0 -10px;
width: auto;
display: inline-block;
}

Enlace: http://www.1kbgrid.com

Be Sociable, Share!

Leave a Reply

Your email address will not be published. Required fields are marked *