Bootstrap 4
Conheça a biblioteca front-end mais utilizada no mundo
Published on 18. May 2018
172 pages
978-85-94188-61-8 (ISBN)
Description
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
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
More details
Person
Natan Souza é front-end designer no grupo Caelum desde 2015, e instrutor dos cursos presenciais de front-end e UX. Além disso, também produz cursos online dessas áreas para a Alura, incluindo os cursos de Sass e LESS. Começou a dar seus primeiros cliques no Photoshop ainda em 2005, o que o levaria a se interessar pela área de Design, e graduando-se bacharel em Design Digital anos mais tarde. Está focado na área de web e UX desde 2009, passando por empresas como FIAP e PMESP. Atuou como front-end e designer em toda a sua trajetória profissional. Twitter: @designernatan
Content
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
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
