Íomhánna

Doiciméadú agus samplaí chun íomhánna a roghnú in iompar sofhreagrach (mar sin ní éiríonn siad níos mó ná na heilimintí tuismitheora) agus cuireann siad stíleanna éadroma leo - go léir trí ranganna.

Íomhánna sofhreagracha

Déantar íomhánna i Bootstrap sofhreagrach le .img-fluid. max-width: 100%;agus height: auto;cuirtear i bhfeidhm iad ar an íomhá ionas go mbeidh sé scálaí leis an máthaireilimint.

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

Íomhánna SVG agus Internet Explorer

.img-fluidIn Internet Explorer 10 agus 11, tá méideanna díréireach ar íomhánna SVG . Chun seo a shocrú, cuir leis width: 100%;nó .w-100nuair is gá. Méadaíonn an deisiúchán seo formáidí íomhá eile go míchuí, mar sin ní chuireann Bootstrap i bhfeidhm go huathoibríoch é.

Mionsamhlacha íomhá

Chomh maith lenár bhfóntais ga teorann , is féidir leat é a úsáid .img-thumbnailchun cuma teorann chothromú 1px a thabhairt don íomhá.

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

Íomhánna a ailíniú

Ailínigh na híomhánna leis na ranganna snámhphointe cúntóir nó ranganna ailínithe téacs . blockIs féidir íomhánna leibhéal a lárú ag baint úsáide as an .mx-autorang áirgiúlachta corrlaigh .

<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>

Pictiúr

Má tá an eilimint á úsáid agat <picture>chun ileilimintí a shonrú le <source>haghaidh leathanach ar leith <img>, déan cinnte na .img-*ranganna a chur leis an gclib <img>agus ní leis an <picture>gclib.

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