Imagenes

Imágenes

Bootstrap define una serie de clases para aplicar al elemento HTML <img>:

img-fluid:: Permite escalar correctamente la imagen (Esto lo logra Bootstrap 4 definiendo la propiedad max-width: 100%; y height: auto;)
img-thumbnail:: Define un recuadro y muestra la imagen cuando se carga la página en el navegador.
float-left:: Flota la imagen a la izquierda.
float-right :: Flota la imagen a la derecha.
rounded:: Define las esquinas redondeadas en la imagen.
rounded-circle:: Convierte la imagen en un círculo, para ello Bootstrap 4 inicializa la propiedad border-radius: 50%.

Ejemplos:

img-fluid:

img-thumbnail:

float-left:

Lorem ipsum dolor sit, amet consectetur adipisicing elit. Earum, officia. Nihil earum itaque tenetur delectus impedit eum quam quis deleniti quidem placeat excepturi consequatur harum vero dicta, cum accusamus quaerat! Lorem ipsum dolor, sit amet consectetur adipisicing elit. Odit alias aliquid sint ab ad incidunt aliquam! Provident nisi voluptatem sit. Veritatis, aut. Laudantium, corrupti? Error, esse autem? Est, minus tenetur? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi tempore eos tempora natus repellat aut ipsa vero error praesentium suscipit. Ipsum quis distinctio quod temporibus delectus cum nemo minima cumque? Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem, doloribus, odio esse blanditiis temporibus perferendis at cumque harum possimus placeat, quod veritatis unde exercitationem sunt? Perspiciatis molestias eos minima non? Lorem, ipsum dolor sit amet consectetur adipisicing elit. Rerum cupiditate sunt sequi explicabo ab id, inventore excepturi debitis molestiae quos aperiam nobis fugiat consequatur repellat impedit neque minima? Aspernatur, voluptatum.

float-right:

rounded: