Skip to main content Skip ad navigationem soUicitudo
in English

Imagines

Documenta et exempla pro imaginibus optandi in mores dociles (ita numquam majores elementis parentium fiunt) ac levia genera illis addunt - omnia per classes.

Responsiva imagines

Imagines in Bootstrap fiunt responsivae cum .img-fluid. Hoc applicat max-width: 100%;et height: auto;ad imaginem ut librat cum elemento parentis.

Placeholder Responsive image
<img src="..." class="img-fluid" alt="...">

Image ailnthubms

Praeter ad utilitates nostrae radiophonicae , uti potes .img-thumbnailimaginem dare 1px rotundi speciem.

A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera 200x200
<img src="..." class="img-thumbnail" alt="...">

Imagines aligning

Conlineare imagines cum adiutorio float classes or text alignment classes . block-level imagines sitas esse potest utens in .mx-automargine utilitate classis .

Placeholder 200x200 Placeholder 200x200
<img src="..." class="rounded float-start" alt="...">
<img src="..." class="rounded float-end" alt="...">
Placeholder 200x200
<img src="..." class="rounded mx-auto d-block" alt="...">
Placeholder 200x200
<div class="text-center">
  <img src="..." class="rounded" alt="...">
</div>

Picture

Si <picture>elementum uteris ad multa <source>elementa specifica pro specifica <img>, fac .img-*classibus addere <img>et non <picture>tag.

<picture>
  <source srcset="..." type="image/svg+xml">
  <img src="..." class="img-fluid img-thumbnail" alt="...">
</picture>

Sass

Variabilium

Variabiles praesto sunt pro image ailnthubms.

$thumbnail-padding:                 .25rem;
$thumbnail-bg:                      $body-bg;
$thumbnail-border-width:            $border-width;
$thumbnail-border-color:            $gray-300;
$thumbnail-border-radius:           $border-radius;
$thumbnail-box-shadow:              $box-shadow-sm;