Source

Imaykuna

Documentación chaymanta ejemplokuna siq'ikuna kutichiq ruwayman akllanapaq (chayrayku mana hayk'aqpas tayta elementonkumanta aswan hatunchu kanku) chaymanta paykunaman llamp'u estilokuna yapanku —llapa clasekuna kaqnintakama.

Imagenes respuestas

Bootstrap kaqpi siq'ikunaqa kutichiq ruwasqa kanku .img-fluid. max-width: 100%;hinaspapas height: auto;siq’imanmi churasqa kanku, chaynapi tayta elementowan escalananpaq.

100%x250 nisqa 
<img src="..." class="img-fluid" alt="Responsive image">
SVG imaymanakuna chaymanta IE 10

Internet Explorer 10 kaqpi, SVG siq'ikuna kaqwan .img-fluidmana tupaq sayayniyuq kanku. Kayta allichanapaq, width: 100% \9;maypichus necesario chaypi yapay. Kay allichayqa huk siq'i formatokunata mana allintachu sayachin, chayrayku Bootstrap mana kikinmantachu ruwan.

Imahina uchuy qillqakuna

Borde-radius yanapakuyniykumanta yapasqa , .img-thumbnailhuk siq'iman huk muyu 1px frontera rikch'ayta qunaykipaq llamk'achiy atikunki .

200x200 nisqa 
<img src="..." alt="..." class="img-thumbnail">

Imahinakunata chiqanchay

Yanapakuq float clasekunawan icha qillqa chiqanchay clasekunawan siq'ikunata chiqanchay . block-nivel nisqa siq'ikunaqa margen utilidad clase nisqawan chawpichasqa.mx-auto kanman .

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

Rikchay

Sichus <picture>elementota llamk'achkanki achka <source>elementokunata huk específico kaqpaq willanaykipaq , allinta qhaway clasekunata <img>yapayta chaymanta mana etiquetaman..img-*<img><picture>

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