/ / Foundation 4 Media Query - zurb-foundation

Foundation 4 Media Query - zurb-foundation

Soy principiante en el diseño de CSS.

Estoy usando Foundation 4 (Zurb) para diseñar el front-end de mi proyecto universitario. Aprendí que Foundation 4 tiene una naturaleza receptiva para diseñar un diseño receptivo.

¿Hay alguna necesidad de consultar CSS Media con Foundation 4? Si es así, ¿cómo puedo usarlo qué beneficio puedo obtener de eso?

Respuestas

1 para la respuesta № 1

Debe leer las secciones "Media-Queries" y "The Grid" de los documentos: http://foundation.zurb.com/docs/

<div class="row">
<div id="block" class="small-2 large-8 columns">Content</div>
</div>

Este código hará que "#block" tenga 2 columnas de anchopara cada tamaño de pantalla debido a la clase "small-2". La clase "large-8" anula ese comportamiento en un ancho de ventana de 768px y superior, por lo que tiene 8 columnas de ancho en pantallas grandes.

Para simplificar, ese código hará que "#block" tenga 2 columnas de ancho en las pantallas de los teléfonos móviles y 8 columnas en las pantallas de escritorio.

Si necesita soporte IE6-8, necesita usar Respond.js también: https://github.com/scottjehl/Respond