Source

Ta’ãngamýi

Kuatiahaipyre ha techapyrã ojeporavo hag̃ua taꞌãngamýi reko ombohováivape (upéicha hag̃ua arakaꞌeve ndoikói tuichave umi elemento ituvakuéragui) ha oñembojoapy hesekuéra estilo ligero —opavave mboꞌepy rupive.

Ta’angakuéra ombohováiva

Taꞌãngamýi oĩva Bootstrap-pe ojejapo ombohovái hag̃ua .img-fluid. max-width: 100%;ha height: auto;ojejapo taꞌãngamýi rehe ikatu hag̃uáicha oescala elemento túva ndive.

100%x250 rehegua 
<img src="..." class="img-fluid" alt="Responsive image">
SVG taꞌãngamýi ha IE 10

Internet Explorer 10-pe, SVG taꞌãngamýi orekóva .img-fluidoguereko tuichaha desproporcionadamente. Oñemyatyrõ hag̃ua kóva, emoĩve width: 100% \9;tekotevẽhápe. Ko ñemyatyrõ ombotuicha hendape’ỹ ambue ta’ãngamýi formato, upévare Bootstrap ndoiporúi ijeheguiete.

Ta’ãnga’i michĩva

Ore utilidad border-radius rehegua ári , ikatu reipuru .img-thumbnaileme’ẽ hag̃ua peteĩ ta’ãngamýipe peteĩ 1px rembe’y jehechauka jerere.

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

Oñemohenda hag̃ua ta’ãngamýi

Emohenda taꞌãngamýi umi mboꞌepy flotador pytyvõhára térã mboꞌepy jehaipyre ñemohenda rehegua ndive . block-nivel taꞌãngamýi ikatu oñecentra ojeporúvo clase utilidad .mx-automargen rehegua .

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

Ha'ãnga

Oipurúramo <picture>elemento emombeꞌu hag̃ua heta <source>elemento peteĩ específico -pe g̃uarã <img>, eñangareko emoĩ hag̃ua umi .img-*mboꞌepy pe etiqueta-pe <img>ha ndahaꞌei <picture>etiqueta-pe.

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