Documenti di Didattica
Documenti di Professioni
Documenti di Cultura
En el capítulo anterior, presentamos un ejemplo de grid con las clases para dispositivos pequeños
medianos. Se han utilizado dos divs (columnas) y les dimos un 25% / 75% en dispositivos
pequeños y 50% / 50% en dispositivos medianos
Pero en los dispositivos grandes el diseño puede ser mejor como una relación 33% / 66%.
Un dispositivo grande es aquel que su resolución está entre 992 a 1199 pixeles.
Para los dispositivos grandes usaremos las clases .col-lg-*:
El siguiente ejemplo se traducirá en un diseño 25% / 75% en dispositivos pequeños y 50% / 50%
en dispositivos medianas, grandes y muy grandes. En los dispositivos muy pequeños, se apilarán
de forma automática (100% de ancho):
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-6 col-lg-4">
<p>Lorem ipsum...</p>
</div>
<div class="col-sm-9 col-md-6 col-lg-8">
<p>Sed ut perspiciatis...</p>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col-lg-6">
<p>Lorem ipsum...</p>
</div>
<div class="col-lg-6">
<p>Sed ut perspiciatis...</p>
</div>
</div>
</div>