/ / Consultoria de mídia Foundation 4 - zurb-foundation

Foundation 4 Media Query - zurb-foundation

Eu sou iniciante no design de CSS.

Eu estou usando o Foundation 4 (Zurb) para projetar o front end do meu projeto de faculdade. Aprendi que a Foundation 4 é responsiva na natureza para projetar um design responsivo.

Existe alguma necessidade de consulta de mídia CSS com Foundation 4? Se sim, então como posso usá-lo que benefício posso obter com isso?

Respostas:

1 para resposta № 1

Você deve ler as seções "Media-Queries" e "The Grid" dos documentos: http://foundation.zurb.com/docs/

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

Este código fará o "#block" ter 2 colunas de largurapara cada tamanho de tela devido à classe "small-2". A classe "large-8" substitui esse comportamento em uma largura de janela de 768 px e acima, fazendo com que ele tenha 8 colunas de largura em telas grandes.

Para simplificar, esse código processará "#block" com 2 colunas de largura em telas de telefones celulares e 8 colunas em telas de área de trabalho.

Se você precisar do suporte do IE6-8, também precisará usar o Respond.js: https://github.com/scottjehl/Respond