Bootstrap
Um guia completo para construir aplicativos responsivos, modernos e eficientes
Descrição do livro
Bootstrap é a escolha mais popular entre os desenvolvedores para construir sites e aplicativos modernos e responsivos, fornecendo um poderoso framework CSS, com ferramentas open source, extensíveis e fáceis de usar. Oferece inúmeros componentes com base em JavaScript, HTML e CSS, que permitem construir páginas com alto padrão visual.
Este livro foi escrito para qualquer pessoa interessada em aprender o uso desse framework frontend e suas principais ferramentas para o desenvolvimento de interfaces de usuário responsivas e modernas. Seja você um iniciante, um desenvolvedor experiente ou um designer, este livro ajudará você a adquirir conhecimentos fundamentais e avançados sobre o framework, bem como fornecerá as habilidades necessárias para criar interfaces de usuário incríveis e eficientes.
O conteúdo foi escrito de forma clara e concisa, em linguagem didática, mostrando exemplos práticos e exercícios para ajudá-lo a compreender os conceitos apresentados. Você aprenderá desde os conceitos básicos do Grid System, que é a base do layout responsivo no Bootstrap, até a criação de componentes de interface de usuário como botões, formulários e cards, entre outros.
Também conhecerá as melhores práticas para a utilização do Bootstrap, além de exemplos práticos que ajudam a aplicar o conhecimento adquirido em seus próprios projetos. Leitura essencial para quem deseja dominar o Bootstrap e criar interfaces de usuário incríveis e responsivas.
Os exemplos e códigos no livro estão disponíveis para download no site do livro, em https://livrosdomaujor.com.br/bs/download/.Ver menos ▲
Sumário
- Agradecimentos
- Isenção de responsabilidade
- Sobre o autor
- Introdução
- Capítulo 1 ■ Apresentação do Bootstrap
- 1.1 Introdução
- 1.1.1 Histórico
- 1.2 Ambiente de desenvolvimento
- 1.2.1 Estrutura de pastas
- 1.2.2 Template HTML inicial
- 1.3 Integração do Bootstrap ao projeto
- 1.3.1 Uso de CDN
- 1.3.2 Download do Bootstrap
- Capítulo 2 ■ Grid Bootstrap
- 2.1 Introdução
- 2.2 Como é criado o grid Bootstrap
- 2.3 Classes para colunas
- 2.3.1 Prefixo de classes com breakpoint
- 2.3.2 Classes com e sem breakpoint
- 2.3.3 Classe auto para colunas
- 2.3.4 Classes para o contêiner das linhas
- 2.3.5 Gutters
- 2.4 Linhas aninhadas
- 2.5 Classes para o contêiner do grid
- 2.6 Alinhamento vertical de linhas
- 2.7 Alinhamento vertical de colunas
- 2.8 Alinhamento horizontal de colunas
- 2.9 Deslocamento de colunas com uso de classes
- Capítulo 3 ■ Tipografia
- 3.1 Introdução
- 3.2 Família de fontes
- 3.3 Estilização dos elementos h1 até h6 e p
- 3.4 Classes para textos
- 3.4.1 Alinhamento
- 3.4.2 Capitalização
- 3.4.3 Tamanho de fonte
- 3.4.4 Negrito
- 3.4.5 Itálico
- 3.4.6 Espaçamento entre linhas
- 3.4.7 Texto decorado
- 3.4.8 Quebra de texto e overflow
- 3.4.9 Quebra de palavras
- 3.4.10 Texto com fonte monoespaçada
- 3.4.11 Reset de cor
- 3.4.12 Elemento blockquote
- 3.4.13 Lista inline
- 3.4.14 Opacidade
- Capítulo 4 ■ Classes utilitárias
- 4.1 Introdução
- 4.2 Categorias de classes utilitárias
- 4.2.1 Classes utilitárias para cores
- 4.2.2 Classes utilitárias para espaçamentos
- 4.2.3 Classes utilitárias para bordas
- 4.2.4 Classes utilitárias para visibilidade
- 4.2.5 Classes utilitárias para sombras
- 4.2.6 Classes utilitárias para posicionamento
- 4.2.7 Classes utilitárias para largura e altura
- 4.2.8 Classes utilitárias para elementos flutuados
- 4.2.9 Classe utilitárias para texto truncado
- 4.2.10 Classe utilitária para estender link
- 4.2.11 Classes utilitária para aspect ratio
- 4.2.12 Classes utilitárias para alinhamento vertical
- 4.2.13 Classes utilitárias para a propriedade display
- 4.2.14 Classes utilitárias para imagens
- Capítulo 5 ■ Classes utilitárias para flexbox
- 5.1 Introdução
- 5.2 Comportamento flex
- 5.3 Direção dos flex items
- 5.4 Alinhamento dos flex items
- 5.5 Alinhamento individual dos flex items
- 5.6 Alinhamento do conteúdo
- 5.7 Quebra de linha
- 5.8 Ordem dos flex items
- 5.9 Largura dos flex items
- Capítulo 6 ■ Ícones e fontes
- 6.1 Introdução
- 6.2 Ícones
- 6.2.1 Bootstrap Icons
- 6.3 Fontes
- 6.3.1 Google Fonts
- Capítulo 7 ■ Componentes simples
- 7.1 Introdução
- 7.2 Button
- 7.3 Dropdown
- 7.4 Alert
- 7.5 Badge
- 7.6 Breadcrumb
- 7.7 Pagination
- 7.8 Progress
- 7.9 Spinner
- 7.10 Popover
- 7.11 Toast
- 7.12 Tooltip
- Capítulo 8 ■ Componentes complexos
- 8.1 Introdução
- 8.2 Navbar
- 8.3 Nav
- 8.4 Tab
- 8.5 Accordion
- 8.6 List group
- 8.7 Collapse
- 8.8 Modal
- 8.9 Offcanvas
- 8.10 Card
- 8.10.1 Cards isolados
- 8.10.2 Cards agrupados
- 8.11 Carousel
- 8.12 Scrollspy
- Capítulo 9 ■ Tabelas
- 9.1 Introdução
- 9.2 Tabela
- 9.2.1 Tabela básica
- 9.2.2 Efeito zebra
- 9.2.3 Efeitos de cor
- 9.2.4 Efeito de mouse
- 9.2.5 Tabela com bordas
- 9.2.6 Tabela compacta
- 9.2.7 Divisória de seção
- 9.2.8 Alinhamento vertical
- 9.2.9 Elemento caption
- 9.2.10 Tabela responsiva
- Capítulo 10 ■ Formulários
- 10.1 Introdução
- 10.2 Formulário
- 10.3 Controles de formulário
- 10.3.1 Controles input e textarea
- 10.3.2 Controle select
- 10.3.3 Controle checkbox
- 10.3.4 Controle radio
- 10.3.5 Altura de campo input
- 10.3.6 Color picker
- 10.3.7 Datalist
- 10.3.8 Range
- 10.3.9 Rótulo flutuante
- 10.3.10 Input agrupado
- 10.4 Layout de formulário
- 10.4.1 Layout simples
- 10.4.2 Layout complexo
- Capítulo 11 ■ Customização do Bootstrap
- 11.1 Introdução
- 11.2 Pré-processador SASS
- 11.3 Customização de estilos
- 11.3.1 Estilo inline
- 11.3.2 Estilo incorporado
- 11.3.3 Estilo lincado
- 11.4 Dicas de customização pontual
- 11.4.1 Pré-requisitos para customização pontual
- Apêndice A ■ Guia de consulta rápida às classes utilitárias
- A 1 Cores
- A 2 Propriedade display
- A 3 Propriedade text-align
- A 4 Propriedade text-wrap
- A 5 Propriedades word-wrap e word-break
- A 6 Propriedade text-transform
- A 7 Propriedade font-size
- A 8 Propriedades font-weight e font-style
- A 9 Propriedade line-height
- A 10 Declaração font-family: monospace
- A 11 Propriedade text-decoration
- A 12 Propriedade float
- A 13 Propriedade opacity
- A 14 Propriedade overflow
- A 15 Propriedade position
- A 16 Propriedades top, right, bottom e left
- A 17 Propriedade box-shadow
- A 18 Propriedades width e height
- A 19 Propriedades margin e padding
- A 20 Propriedade padding para gutters
- A 21 Propriedades para o modo FlexBox
- A 21.1 Propriedade justify-content
- A 21.2 Propriedade align-items
- A 21.3 Propriedade align-self
- A 21.4 Propriedade align-content
- A 21.5 Propriedades flex-grow e flex-shrink
- A 21.6 Ordem dos flex items
- A 21.7 Propriedade flex-wrap
- A 21.8 Flex fill
- Índice remissivo
Sobre o autor
Maurício Samy Silva é graduado em Engenharia Civil pelo Instituto Militar de Engenharia (IME). Exerceu o magistério paralelamente à Engenharia e foi professor de Geometria Descritiva e Matemática. Sua experiência com desenvolvimento iniciou-se em 1999. Em 2003 lançou o site https://maujor.com, que se tornou referência nacional em CSS, com a… Ver perfil completo ▶






