Utilidades para maquetación

Para un desenvolvemento máis rápido e adaptado para móbiles, Bootstrap inclúe decenas de clases de utilidade para mostrar, ocultar, aliñar e espazar contido.

Cambiandodisplay

Use as nosas utilidades de visualización para cambiar de forma sensible os valores comúns da displaypropiedade. Mestúrao co noso sistema de grade, contido ou compoñentes para mostralos ou ocultalos en ventanas gráficas específicas.

Opcións de Flexbox

Bootstrap 4 está construído con flexbox, pero non todos os elementos displayse cambiaron display: flexporque isto engadiría moitas anulacións innecesarias e cambiaría inesperadamente os comportamentos clave do navegador. A maioría dos nosos compoñentes están construídos con flexbox activado.

Se necesitas engadir display: flexa un elemento, faino con .d-flexou cunha das variantes sensibles (por exemplo, .d-sm-flex). Necesitarás esta clase ou displayvalor para permitir o uso das nosas utilidades flexbox adicionais para o tamaño, o aliñamento, o espazado e moito máis.

Marxe e recheo

Use as utilidades margine padding espazamento para controlar como se espazan e dimensionan os elementos e os compoñentes. Bootstrap 4 inclúe unha escala de cinco niveis para as utilidades de espazamento, baseada nunha variable de 1remvalor predeterminada . $spacerEscolla os valores para todas as vistas (por exemplo, .mr-3para margin-right: 1rem) ou escolle variantes sensibles para orientarse a vistas específicas (por exemplo, .mr-md-3para margin-right: 1remcomezar no punto de mdinterrupción).

Alternavisibility

Cando a alternancia displaynon sexa necesaria, podes alternar visibilityentre un elemento coas nosas utilidades de visibilidade . Os elementos invisibles seguirán afectando o deseño da páxina, pero están ocultos visualmente aos visitantes.