Source

Hmanlai thil hlui te

Documentation leh responsive behavior-a image thlan dan entirnan (chuvangin an nu leh pa element aia lian an ni ngai lo) leh an chungah style lightweight te dah belh tur—class kaltlangin zawng zawng.

Responsive thlalak te

Bootstrap a images te hi responsive taka siam a ni a .img-fluid. max-width: 100%;leh height: auto;image-ah chuan parent element nena a scale theih nan an hmang bawk.

100%x250 a ni
<img src="..." class="img-fluid" alt="Responsive image">
SVG images leh IE 10 te a awm bawk

Internet Explorer 10 ah chuan SVG images with .img-fluidte hi a size a inang lo hle. Hei hi siamthat tur width: 100% \9;chuan a tulna hmunah add tur a ni. He fix hian image format dangte chu a size dik lo a, chuvangin Bootstrap hian automatic in a apply lo.

Hmanlai thil hlui te

Kan border-radius utilities.img-thumbnail bakah hian image pakhat chu rounded 1px border appearance pe turin i hmang thei bawk.

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

Hmanlai thlalakte alignment

Image te chu helper float class emaw text alignment class emaw nen align rawh . block-level images chu .mx-automargin utility class hmangin centered theih a ni .

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

Milem

Element chu specific -a element <picture>tam tak tarlanna atana i hman a nih chuan , class-te chu tag-ah dah la, tag -ah dah lovin dah ngei ngei tur a ni.<source><img>.img-*<img><picture>

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