/ / Foundation 4 Media Query - zurb-foundation

Foundation 4 Media Query - zurb-foundation

Sono principiante nella progettazione CSS.

Sto usando la Fondazione 4 (Zurb) per progettare il front end del mio progetto universitario. Ho appreso che Foundation 4 è di natura reattiva per progettare un design reattivo.

C'è bisogno di una query CSS Media con Foundation 4? Se sì, allora come posso usarlo quali benefici posso ottenere da questo?

risposte:

1 per risposta № 1

Dovresti leggere le sezioni "Media-Query" e "The Grid" dei documenti: http://foundation.zurb.com/docs/

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

Questo codice renderà "#block" largo 2 colonneper ogni dimensione dello schermo dovuta alla classe "small-2". La classe "large-8" sovrascrive quel comportamento su una larghezza della finestra di 768 px o superiore, rendendolo largo 8 colonne su schermi di grandi dimensioni.

Per semplificare, quel codice renderà "#block" di larghezza pari a 2 colonne su schermi di cellulari e 8 colonne su schermi desktop.

Se hai bisogno del supporto IE6-8, devi usare anche Respond.js: https://github.com/scottjehl/Respond