Não foi possível carregar a disponibilidade de retirada.
Design Responsivo com CSS3 Flexbox
Descubra a poderosa ferramenta de flexboxes ou flexbox para criar páginas responsivas.
Neste curso, você aprenderá como desenvolver páginas responsivas usando a poderosa ferramenta de flexboxes ou flexbox. Basearemos no mais recente padrão de 2014 do W3C para flexbox. Analisaremos os conceitos básicos desse esquema, que nos permitirá criar layouts e alinhá-los verticalmente ou horizontalmente, centralizá-los, alterar a ordem das caixas internas ou itens flexíveis, bem como as propriedades para esticar, girar e adaptar as caixas internas ao contêiner flexível de forma natural. Criaremos exemplos de páginas responsivas partindo do zero e preenchendo-as com conteúdo. Criaremos uma galeria responsiva com diferentes imagens que se adaptarão ao tamanho do dispositivo, ajustando-se tanto a tablets quanto a smartphones. Também forneceremos um exemplo de como animar flexboxes usando as propriedades de transição do nível três das folhas de estilo em cascata. Por fim, codificaremos um menu horizontal com flexboxes que mudará sua orientação para vertical quando visualizado em telas pequenas, como telefones, onde menus longos são complicados. Para aproveitar ao máximo este curso, é necessário ter conhecimentos básicos de HTML e CSS. Também é desejável conhecer HTML5 e CSS3, embora não seja essencial. Para fazer este curso, você precisa de um editor de código como SublimeText, Brackets, Aptana ou Dreamweaver, e um navegador moderno, além de um forte desejo de aprender.
O que você aprenderá
- Criar uma página baseada em flexboxes
- Alterar a direção dos flexboxes de horizontal para vertical e a ordem das caixas internas
- Justificar e alinhar as caixas internas
- Alterar a ordem das caixas internas individuais
- Alterar a proporção de largura e comprimento dos itens flexíveis
- Criar páginas responsivas com flexboxes
- Aplicar transições aos flexboxes
- Criar uma galeria usando flexboxes
- Criar um menu responsivo
