Opções de grade
Embora o Bootstrap use ou para definir a maioria dos tamanhos, eles são usados para pontos de interrupção da grade e larguras de contêineres.Isso ocorre porque a largura da janela de visualização está em pixels e não muda com o tamanho da fonte.Veja como funcionam os aspectos do Bootstrap O sistema de grade funciona em vários dispositivos com uma mesa prática.
|
Extra pequeno <576px |
Pequeno ≥576px |
Médio ≥768px |
Grande ≥992px |
Extra grande ≥1200px |
|
|---|---|---|---|---|---|
| Largura máxima do contêiner | Nenhum (automático) | 540px | 720 unidades | 960 unidades | 1140 pixels |
| Prefixo de classe | .col- |
.col-sm- |
.col-md- |
.col-lg- |
.col-xl- |
| # de colunas | 12 | ||||
| Largura da calha | 24px (12px em cada lado de uma coluna) | ||||
| Nestable | Sim | ||||
| Ordenação de colunas | Sim | ||||
Coluna da Grade
Usando um único conjunto de classes de grade, você pode criar um sistema de grade padrão que começa empilhado em dispositivos móveis e tablets (do intervalo extra pequeno a pequeno) antes de se tornar horizontal em dispositivos desktop (médios).Coloque colunas da grade em qualquer
.Col-lg-12
.Col-lg-11
.Col-lg-01
.Col-lg-10
.Col-lg-02
.Col-lg-09
.Col-lg-03
.Col-lg-08
.Col-lg-04
.Col-lg-07
.Col-lg-05
.Col-lg-06
.Col-lg-06
.Col-lg-05
.Col-lg-07
.Col-lg-04
.Col-lg-08
.Col-lg-03
.Col-lg-09
.Col-lg-02
.Col-lg-10
.Col-lg-01
.Col-lg-11