¿Qué es class="mb-0" en Bootstrap 4?

Resuelto Phillip Senn asked hace 7 años • 7 respuestas

La última documentación tiene:

<p class="mb-0">Lorem ipsum</p>
Expandir fragmento

Qué es mb-0?

Phillip Senn avatar Jan 11 '17 00:01 Phillip Senn
Aceptado

Arranque 4

Bootstrap tiene una amplia gama de clases de utilidades de margen y relleno receptivas. Funcionan para todos los puntos de interrupción:

xs (<576px), sm (>=576px), md (>=768px), lg (>=992px) o xl (>=1200px))

Las clases se utilizan en el formato:

{property}{sides}-{size} para xs y {property}{sides}-{breakpoint}-{size} para sm, md, lg y xl.

m - establece el margen

p - establece relleno


t - establece margen superior o relleno superior

b - establece el margen inferior o el relleno inferior

l - establece margen izquierdo o relleno izquierdo

r - establece margen derecho o relleno derecho

x - establece tanto el relleno izquierdo como el relleno derecho o el margen izquierdo y el margen derecho

y - establece tanto padding-top como padding-bottom o margin-top y margin-bottom

en blanco : establece un margen o relleno en los 4 lados del elemento


0 : establece el margen o el relleno en 0

1 : establece el margen o el relleno en .25rem (4 px si el tamaño de fuente es 16 px)

2 : establece el margen o el relleno en .5rem (8 px si el tamaño de fuente es 16 px)

3 : establece el margen o el relleno en 1rem (16 px si el tamaño de fuente es 16 px)

4 : establece el margen o el relleno en 1,5 rem (24 px si el tamaño de fuente es 16 px)

5 : establece el margen o el relleno en 3rem (48 px si el tamaño de fuente es 16 px)

auto - establece el margen en auto

Ver más en Bootstrap 4.5 - Espaciado

Leer más en w3schools

Akash Preet avatar May 09 '2018 10:05 Akash Preet

Arranque 4

Se utiliza para crear un margen inferior de 0 ( margin-bottom:0). Puede ver más de las nuevas clases de utilidades de espaciado aquí: https://getbootstrap.com/docs/4.0/utilities/spacing/

Relacionado: ¿Cómo uso las clases de utilidad de espaciado en Bootstrap 4?

Carol Skelly avatar Jan 10 '2017 17:01 Carol Skelly

m- para clases que establecen margen, como este:

  • mt- para clases que establezcanmargin-top
  • mb- para clases que establezcanmargin-bottom
  • ml- para clases que establezcanmargin-left
  • mr- para clases que establezcanmargin-right
  • mx- para clases que establecen tanto margin-leftymargin-right
  • my- para clases que establecen tanto margin-topymargin-bottom

Donde el tamaño es uno de margen:

  • 0- para clases que eliminan el margen estableciéndolo en 0, comomt-0
  • 1- (por defecto) para clases que establecen el margen en $spacer * .25, comomt-1
  • 2- (por defecto) para clases que establecen el margen en $spacer * .5, comomt-2
  • 3- (por defecto) para clases que establecen el margen en $spacer, comomt-3
  • 4- (por defecto) para clases que establecen el margen en $spacer * 1.5, comomt-4
  • 5- (por defecto) para clases que establecen el margen en $spacer * 3, comomt-5
  • auto- para clases que establecen el margen en automático, comomx-auto
STA avatar Mar 10 '2020 12:03 STA

Bootstrap tiene clases predefinidas que usamos para diseñar. Si está familiarizado con CSS, sabrá qué son el relleno, el margen y el espaciado, etc.

mb-0 = margen inferior: 0;

Bien, ahora avanzamos un poco más en el conocimiento, bootstrap tiene más clases para margen que incluyen:

mt- = margin-top
mb- = margin-bottom
ml- = margin-left
mr- = margin-right
my- = it sets margin-left and margin-right at the same time on y axes
mX- = it sets margin-bottom and margin-top at the same time on X axes

Esto y mucho más se explica aquí https://getbootstrap.com/docs/5.0/utilities/spacing/ La mejor manera de aprender es a través del sitio https://getbootstrap.com . Explica mucho sobre sus clases integradas.

Fifi avatar Feb 16 '2021 21:02 Fifi