Source

प्रतिमा

प्रतिसाद दिवपी वागणूकांत प्रतिमा निवडपा खातीर दस्तावेजीकरण आनी उदाहरणां (म्हणून तीं केन्नाच तांच्या पालक घटकां परस व्हड जायनात) आनी तांकां हलके वजनाचीं शैलीं जोडचीं-सगलीं वर्गां वरवीं.

प्रतिसाद दिवपी प्रतिमा

बूटस्ट्रॅपांतली प्रतिमा प्रतिसाद दिवपी केल्यात .img-fluid. max-width: 100%;आनी height: auto;प्रतिमेचेर लागू करतात जेणे करून ती पालक घटकावांगडा स्केल करता.

Placeholder Responsive image
<img src="..." class="img-fluid" alt="Responsive image">
एसव्हीजी प्रतिमा आनी आयई 10

Internet Explorer 10 त, SVG प्रतिमा with .img-fluidविपरीत आकाराचे आसात. हें सुदारपाक, width: 100% \9;गरज पडटा थंय जोडचें. हे निवारण हेर प्रतिमा स्वरूपांचो आकार चुकीचो करता, देखून बूटस्ट्रॅप आपोआप लागू करिना.

प्रतिमा लघुप्रतिमा

In addition to our border-radius utilities.img-thumbnail , तुमी प्रतिमेक वाटकुळें 1px शिमेचें रूप दिवपाक वापरूं येता .

A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera 200x200
<img src="..." alt="..." class="img-thumbnail">

प्रतिमा संरेखित करप

मदत करपी फ्लोट वर्ग वा मजकूर संरेखण वर्गां वांगडा प्रतिमा संरेखित करात . -स्तरीय प्रतिमा मार्जिन उपयुक्तताय वर्गblock वापरून केंद्रीत करूंक शकतात ..mx-auto

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

चित्र

जर तुमी एका विशिश्ट खातीर <picture>जायते घटक निर्देशीत करपाक घटक वापरतात जाल्यार, वर्ग टॅगाक जोडपाची खात्री करात आनी टॅगाक न्हय.<source><img>.img-*<img><picture>

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