Source

Dagiti Ladawan

Dokumentasion ken dagiti pagarigan para iti panagpili kadagiti ladawan iti makasungbat a kababalin (isu a pulos a dida agbalin a dakdakkel ngem dagiti nagannak nga elementoda) ken manginayon kadagiti nalag-an nga estilo kadagitoy—amin babaen dagiti klase.

Dagiti makasungbat a ladawan

Dagiti ladawan iti Bootstrap ket naaramid a makasungbat babaen ti .img-fluid. max-width: 100%;ken height: auto;maipakat iti ladawan tapno ag-scale daytoy babaen ti nagannak nga elemento.

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

Dagiti ladawan ti SVG ken IE 10

Iti Internet Explorer 10, dagiti ladawan ti SVG nga addaan .img-fluidket disproporsional ti kadakkelda. Tapno matarimaan daytoy, inayonmo width: 100% \9;no kasapulan. Daytoy a panagtarimaan ket saan nga umiso a mangpadakkel kadagiti sabali a pormat ti ladawan, isu a ti Bootstrap ket saan nga automatiko nga iyaplikar daytoy.

Dagiti thumbnail ti ladawan

Malaksid kadagiti border-radius utilities mi , mabalinmo nga usaren .img-thumbnaila mangted ti maysa a ladawan iti nagtimbukel a 1px a langa ti beddeng.

<img src="..." alt="..." class="img-thumbnail">

Panangitunos kadagiti ladawan

Itunos dagiti ladawan kadagiti klase ti float ti katulongan wenno dagiti klase ti panagtunos ti teksto . block-level a ladawan ket mabalin a maisentro babaen ti panagusar ti klase ti utilidad ti .mx-automargin .

<img src="..." class="rounded float-left" alt="...">
<img src="..." class="rounded float-right" alt="...">

<img src="..." class="rounded mx-auto d-block" alt="...">

<div class="text-center">
  <img src="..." class="rounded" alt="...">
</div>

Ladawan

No agus-usar ka ti <picture>elemento tapno mangibaga kadagiti adu <source>nga elemento para iti espesipiko <img>, siguraduem nga inayon dagiti .img-*klase iti <img>ken saan nga iti <picture>etiketa.

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