Diminuta rejilla Flexbox de 12 columnas-ragrid. CSS
| Autor: | argyleink |
|---|---|
| Views Total: | 1,788 |
| Sitio oficial: | Ir a la web |
| Actualizado: | April 14, 2017 |
| Licencia: | MIT |
Vista prévia
Descripción
El ragrid. CSS proporciona una manera fácil y conveniente de crear un diseño de cuadrícula adaptable basado en Flexbox para su proyecto web moderno. Totalmente personalizable a través de atributos en lugar de clases CSS.
Install the ragrid.css:
# Yarn yarn add ragrid # NPM $ npm install ragrid
Funcionamiento
Importa el ragrid. CSS en tu proyecto.
<link rel="stylesheet" href="css/ragrid.css">
Cree una rejilla de Flexbox básica como esta:
<section grid> ... </section>
Establezca la alineación con los siguientes atributos:
- alineado horizontalmente: izquierda, centro, derecha
- alineado verticalmente: superior, central, inferior, línea base
<section grid horizontally-aligned="right" vertically-aligned="top"> ... </section>
Establezca la distribución:
- distribuido horizontalmente: entre, alrededor, igual
- distribuido verticalmente: entre, igual,
<section grid horizontally-distributed="equal" vertically-distributed="around"> ... </section>
