O Design Responsivo é uma abordagem de web design onde o conteúdo se ajusta aos diferentes tamanhos de tela e janelas de uma variedade de dispositivos.
A grade como fundamento do design responsivo
Uma grade consiste em um conjunto distinto de relações baseadas em alinhamento que atuam como guias para a distribuição de elementos em um formato. Cada grade contém as mesmas partes básicas, não importa o quão complexa se torne. Cada parte cumpre uma função específica e as peças podem ser combinadas conforme necessário ou omitidas da estrutura geral a critério do designer, dependendo de como eles interpretam os requisitos de informação do material.
Timothy Samara em "Grid - Construção e desconstrução"
Mobile First. Será?
O box model
Display: As alternativas tradicionais
Display: Block
Display: Inline
O negrito é um inline em duas linhas
Display: Inline-Block
Flex-box: O conteúdo no comando
O
conteúdo
no
comando
Grid: A estrutura no comando
A
estrutura
no
comando
TailwindCSS Nomes de classe semânticas ou utility-first CSS?