in English

प्रतिमा

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

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

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

Placeholder Responsive image
<img src="..." class="img-fluid" alt="...">
एसव्हीजी प्रतिमा आनी इंटरनॅट एक्सप्लोरर

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

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

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="..." class="img-thumbnail" alt="...">

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

मदत करपी फ्लोट वर्ग वा मजकूर संरेखण वर्गां वांगडा प्रतिमा संरेखित करात . -स्तरीय प्रतिमा मार्जिन उपयुक्तताय वर्ग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>