Utilitários para layout
Para um desenvolvimento responsivo e amigável para dispositivos móveis mais rápido, o Bootstrap inclui dezenas de classes de utilitários para mostrar, ocultar, alinhar e espaçar o conteúdo.
Mudandodisplay
Use nossos utilitários de exibição para alternar responsivamente valores comuns da display
propriedade. Misture com nosso sistema de grade, conteúdo ou componentes para mostrá-los ou ocultá-los em janelas de visualização específicas.
Opções do Flexbox
O Bootstrap é construído com flexbox, mas nem todos os elementos display
foram alterados, display: flex
pois isso adicionaria muitas substituições desnecessárias e alteraria inesperadamente os principais comportamentos do navegador. A maioria dos nossos componentes são construídos com flexbox habilitado.
Se você precisar adicionar display: flex
a um elemento, faça isso com .d-flex
ou uma das variantes responsivas (por exemplo, .d-sm-flex
). Você precisará dessa classe ou display
valor para permitir o uso de nossos utilitários flexbox extras para dimensionamento, alinhamento, espaçamento e muito mais.
Margem e preenchimento
Use os utilitáriosmargin
e espaçamento para controlar como os elementos e componentes são espaçados e dimensionados. O Bootstrap inclui uma escala de seis níveis para utilitários de espaçamento, com base em uma variável padrão de valor . Escolha valores para todas as janelas de visualização (por exemplo, para em LTR) ou escolha variantes responsivas para segmentar janelas de visualização específicas (por exemplo, para —em LTR— começando no ponto de interrupção).padding
1rem
$spacer
.me-3
margin-right: 1rem
.me-md-3
margin-right: 1rem
md
Alternarvisibility
Quando display
a alternância não é necessária, você pode alternar a visibility
de um elemento com nossos utilitários de visibilidade . Elementos invisíveis ainda afetarão o layout da página, mas ficam visualmente ocultos aos visitantes.