/ / Foundation 4 Media Query - zurb-foundation

Foundation 4 Media Query - zurb-foundation

Je suis débutant en conception CSS.

J'utilise Foundation 4 (Zurb) pour concevoir l'avant-projet de mon projet d'université. J'ai appris que Foundation 4 est sensible à la nature pour concevoir un design réactif.

Existe-t-il un besoin de requête CSS Media avec Foundation 4? Si oui, comment puis-je l'utiliser quel bénéfice je peux en tirer?

Réponses:

1 pour la réponse № 1

Vous devriez lire les sections "Media-Queries" et "The Grid" des documents: http://foundation.zurb.com/docs/

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

Ce code fera que "#block" aura 2 colonnes de largepour chaque taille d'écran en raison de la classe "small-2". La classe "large-8" remplace ce comportement sur une largeur de fenêtre de 768px et plus, soit 8 colonnes de large sur les grands écrans.

Pour simplifier, ce code rendra "#block" 2 colonnes de large sur les écrans de téléphone mobile et 8 colonnes sur les écrans de bureau.

Si vous avez besoin du support IE6-8, vous devez également utiliser Respond.js: https://github.com/scottjehl/Respond