Bootstrap 5 - Layout - Níveis de grade ou Pontos de Interrupção (breakpoint)

ATENÇÃO: ligue a legenda em português para visualizar a explicação.
1) Neste vídeo você verá como os container se comportam com alteração do tamanho da tela.
2) Conceitos importantes:
¤ O Bootstrap é um kit de ferramentas de front-end poderoso e repleto de recursos. Construa qualquer coisa - do protótipo à produção - em minutos.
¤ Pontos de interrupção (Breakpoints) são larguras personalizáveis ​​que determinam como seu layout responsivo se comporta em dispositivos ou tamanhos de viewport no Bootstrap.
¤ O Bootstrap inclui seis pontos de interrupção padrão, às vezes chamados de níveis de grade , para construção responsiva.
¤ Ponto de interrupção e Dimensões:
» Muito pequeno: menor 576px
» Pequena(sm): maior ou igual 576px
» Médio(md): maior ou igual 768px
» Grande(lg): maior ou igual 992 px
» Extra grande(xl): maior ou igual 1200px
» Extra extra grande(xxl): maior ou igual 1400px
3) Acesse o código de exemplo no link abaixo:
jsbin.com/xiri...
4) Se quiser saber mais sobre pontos de interrupção, consulte o link:
getbootstrap.c...
Obrigada,
Prof@ Ana Paula Costacurta