Para usar layouts de grade do Bootstrap 5, siga estas etapas:
1.
Escolha um sistema de grade: O Bootstrap 5 oferece dois sistemas de grade:um sistema de grade tradicional de 12 colunas e um novo e mais flexível sistema de grade "primeiro o contêiner". A grade container-first foi projetada para facilitar o desenvolvimento, melhor desempenho e mais flexibilidade no layout.
2.
Crie um contêiner de grade: A classe principal para criar um contêiner de grade é `.container`. Isso controlará a largura geral e a capacidade de resposta da grade. Você pode adicionar classes adicionais para controlar o preenchimento e as margens, como `.container-xl` para contêineres extra grandes ou `.container-sm` para contêineres pequenos.
3.
Adicionar linhas de grade: Dentro do contêiner da grade, você pode criar linhas usando a classe `.row`. Cada linha representa uma linha horizontal de conteúdo.
4.
Adicionar colunas de grade: Dentro de cada linha, você pode criar colunas usando a classe `.col`. As colunas representam seções verticais de conteúdo. Você pode usar uma variedade de classes de colunas para controlar a largura das colunas, como `.col-2` para um layout de duas colunas ou `.col-md-4` para um layout de quatro colunas em dispositivos de tamanho médio.
5.
Adicione conteúdo às colunas: Depois de criar suas linhas e colunas, você pode adicionar conteúdo a elas adicionando elementos HTML como texto, imagens, botões e assim por diante.
Aqui está um exemplo de como criar um layout de grade simples usando Bootstrap 5:
```html
Coluna 1
Coluna 2
Coluna 3
```
Este código cria um layout de grade de três colunas. O contêiner garante que a grade esteja centralizada na janela do navegador, enquanto as classes de linha e coluna criam a estrutura real da grade.
Bootstrap 5 também oferece várias classes utilitárias que podem ser usadas para aprimorar ainda mais o layout, como `.w-50` para definir a largura de um elemento para 50% ou `.text-center` para centralizar o texto dentro de um elemento.
Ao combinar contêineres, linhas, colunas e classes de utilitários, você pode criar uma ampla variedade de layouts de grade usando Bootstrap 5.
