Source

Bililingi

Mikanda mpe bandakisa mpo na kopona bilili na bizaleli ya koyanola (yango wana ekomaka ata moke te monene koleka biloko na bango ya moboti) mpe kobakisa mitindo ya pete na yango —nyonso na nzela ya bakelasi.

Bililingi oyo ezali kopesa eyano

Ba images na Bootstrap esalemi responsive na .img-fluid. max-width: 100%;mpe height: auto;esalemi na elilingi mpo ete esala échelle na eleman ya moboti.

Placeholder Responsive image
<img src="..." class="img-fluid" alt="Responsive image">
Bililingi ya SVG mpe IE 10

Na Internet Explorer 10, bilili ya SVG na .img-fluidezali na bonene ya kozanga boyokani. Mpo na kobongisa likambo yango, bakisá width: 100% \9;esika oyo esengeli. Bobongisi oyo ebongisi na ndenge ya mabe ba formats ya bilili mosusu, yango wana Bootstrap esalela yango automatiquement te.

Bilili ya mike

En plus ya ba utilitaires na biso ya border-radius , okoki kosalela .img-thumbnailpona kopesa image apparence ya border ya 1px arrondi.

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="..." alt="..." class="img-thumbnail">

Kobongisa bililingi

Bongisa bilili na bakelasi ya flotteur ya mosungi to bakelasi ya boyokani ya makomi . block-niveau bilili ekoki kozala na katikati na kosalelaka kelasi ya utilitaire ya .mx-automarge .

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

Foto

Soki ozali kosalela <picture>eleman mpo na kolakisa <source>biloko mingi mpo na moko ya sikisiki <img>, sala makasi obakisa .img-*bakelasi na <img>mpe te na <picture>elembo.

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