Marco de cuadrícula ligero de 12 columnas-mygGrid. CSS

Vista prévia

Descripción

Solo otro Grid Framework de 12 columnas usado para crear un sistema de rejilla adaptable, fluido y adaptativo para su proyecto Web.

Funcionamiento

Cargue la hoja de estilo de núcleo en la sección Head de su documento HTML y haga.

<link rel="stylesheet" href="css/layout.css">

Estructura básica de una cuadrícula de mygGrid.

<div class="container">

<div class="row">


<div class="col-12">



<div class="info">.col-12</div>


</div>

</div>

<div class="row">


<div class="col-6">



<div class="info">.col-6</div>


</div>


<div class="col-6">



<div class="info">.col-6</div>


</div>

</div>

<div class="row">


<div class="col-4">



<div class="info">.col-4</div>


</div>


<div class="col-4">



<div class="info">.col-4</div>


</div>


<div class="col-4">



<div class="info">.col-4</div>


</div>

</div>

<div class="row">


<div class="col-3 col-sm-3">



<div class="info">.col-3</div>


</div>


<div class="col-3 col-sm-3">



<div class="info">.col-3</div>


</div>


<div class="col-3 col-sm-3">



<div class="info">.col-3</div>


</div>


<div class="col-3 col-sm-3">



<div class="info">.col-3</div>


</div>

</div>

<div class="row">


<div class="col-2 col-sm-2">



<div class="info">.col-2</div>


</div>


<div class="col-2 col-sm-2">



<div class="info">.col-2</div>


</div>


<div class="col-2 col-sm-2">



<div class="info">.col-2</div>


</div>


<div class="col-2 col-sm-2">



<div class="info">.col-2</div>


</div>


<div class="col-2 col-sm-2">



<div class="info">.col-2</div>


</div>


<div class="col-2 col-sm-2">



<div class="info">.col-2</div>


</div>

</div>

<div class="row">


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>


<div class="col-1 col-sm-1">



<div class="info">.col-1</div>


</div>

</div>
</div>