Conteúdo

Fazer um site elegante nunca foi tão fácil, mesmo para quem não sabe escrever uma linha de CSS e, muito menos, entende como harmonizar cores, balancear elementos e tipografia. O Bootstrap é, resumidamente, um grande arquivo CSS com uma excelente documentação, que possui dezenas e dezenas de componentes prontos. No começo, foi criado pelo Twitter para servir como um guia de estilos em CSS da empresa; hoje, é a biblioteca mais famosa e utilizada no mundo.

Neste livro, Natan Souza ensinará como trabalhar com esta fantástica biblioteca em sua última versão 4 ao montar uma página do zero, a partir de um wireframe. Você verá seus principais componentes, como menu responsivo, grids, painéis e botões, além de aprender a customizar seu tema padrão e algumas boas práticas de HTML5, sempre levando em consideração a semântica do código.

Versões utilizadas: Bootstrap 4

Saiba o que você vai aprender

Sumário

• 1 O projeto Better
• 1.1 E no mobile?
• 1.2 Terminando o menu
• 1.3 Resumo

• 2 Destacando o que deve ser destacado
• 2.1 Relembrando o wireframe e colocando a mão na massa
• 2.2 Jumbo quem?
• 2.3 Tirando as margens
• 2.4 Estilizando um campo de formulário
• 2.5 Campo e botão lado a lado
• 2.6 Resumo

• 3 Entendendo as grids do Bootstrap
• 3.1 Analisando o wireframe da galeria
• 3.2 Começando a marcação
• 3.3 Centralizando tudo
• 3.4 Melhorando a galeria
• 3.5 Um site responsivo para telas maiores
• 3.6 Ajustando para telas maiores
• 3.7 Resumo

• 4 Flexbox, agora no Bootstrap
• 4.1 Não é TV Fama, é Hall da Fama!
• 4.2 O flexbox mais rápido do oeste
• 4.3 Ajeitando o hall
• 4.4 Resumo

• 5 Media, um componente atualizado
• 5.1 Um antigo componente
• 5.2 Resumo

• 6 Cartas na mesa: brincando com o card
• 6.1 Começando com o plano
• 6.2 Estilizando nosso primeiro card
• 6.3 Aplicando a grid aos cards
• 6.4 Mudando o estilo do plano principal
• 6.5 Fazendo o rodapé
• 6.6 Resumo

• 7 Classes semânticas e CSS mais leve
• 7.1 Diminuindo a poluição no HTML usando Sass
• 7.2 Preparando a infra
• 7.3 Juntando regras CSS em uma só classe
• 7.4 Escolhendo o que usar do Bootstrap
• 7.5 Resumo

• 8 Conselhos e dicas
• 8.1 Qual é o melhor framework CSS?
• 8.2 Links de saideira