Ir para o conteúdo principal
Há uma versão mais recente do Bootstrap 4!

Exemplos

Inicie rapidamente um projeto com qualquer um de nossos exemplos, desde o uso de partes da estrutura até componentes e layouts personalizados.

Baixe o código fonte

Componentes personalizados

Novos componentes e modelos para ajudar as pessoas a começar rapidamente com o Bootstrap e demonstrar as melhores práticas para adicionar à estrutura.

Captura de tela do álbum
Álbum

Modelo simples de uma página para galerias de fotos, portfólios e muito mais.

Captura de tela de preços
Preços

Exemplo de página de preços criada com Cartões e com cabeçalho e rodapé personalizados.

Captura de tela do checkout
Confira

Formulário de checkout personalizado mostrando nossos componentes de formulário e seus recursos de validação.

Captura de tela do produto
produtos

Página de marketing enxuta com foco no produto com extenso trabalho de grade e imagem.

Captura de tela da capa
Cobrir

Um modelo de uma página para criar páginas iniciais simples e bonitas.

Captura de tela do carrossel
Carrossel

Personalize a barra de navegação e o carrossel e adicione alguns novos componentes.

Captura de tela do blog
Blogue

Revista como modelo de blog com cabeçalho, navegação, conteúdo em destaque.

Captura de tela do painel
Painel

Shell básico do painel de administração com barra lateral e barra de navegação fixas.

Captura de tela de login
Entrar

Layout e design de formulário personalizado para um formulário de entrada simples.

Captura de tela do rodapé fixo
Rodapé fixo

Anexe um rodapé à parte inferior da janela de visualização quando o conteúdo da página for curto.

Captura de tela da barra de navegação do rodapé fixo
Navbar de rodapé fixo

Anexe um rodapé à parte inferior da viewport com uma barra de navegação superior fixa.

Estrutura

Exemplos que se concentram na implementação de usos de componentes internos fornecidos pelo Bootstrap.

Captura de tela do modelo inicial
Modelo inicial

Nada além do básico: CSS compilado e JavaScript.

Captura de tela da grade
Rede

Vários exemplos de layouts de grade com todas as quatro camadas, aninhamento e muito mais.

Captura de tela do Jumbotron
Jumbotron

Construa em torno do jumbotron com uma barra de navegação e algumas colunas de grade básicas.

Pegando o componente padrão da barra de navegação e mostrando como ele pode ser movido, posicionado e estendido.

Captura de tela das barras de navegação
Barras de navegação

Demonstração de todas as opções responsivas e de contêiner para a barra de navegação.

Captura de tela estática da barra de navegação
Barra de navegação estática

Exemplo de barra de navegação única de uma barra de navegação superior estática junto com algum conteúdo adicional.

Captura de tela corrigida da barra de navegação
Barra de navegação corrigida

Exemplo de barra de navegação única com uma barra de navegação superior fixa juntamente com algum conteúdo adicional.

Captura de tela inferior da barra de navegação
Parte inferior da barra de navegação

Exemplo de barra de navegação única com uma barra de navegação inferior junto com algum conteúdo adicional.

Experimentos

Exemplos que se concentram em recursos ou técnicas amigáveis ​​para o futuro.

Captura de tela de rótulos flutuantes
Etiquetas flutuantes

Formulários maravilhosamente simples com rótulos flutuantes sobre suas entradas.

Captura de tela offcanvas
Offcanvas

Transforme sua barra de navegação expansível em um menu deslizante fora da tela.