Source

આંકડા

બુટસ્ટ્રેપમાં આકૃતિ ઘટક સાથે સંબંધિત છબીઓ અને ટેક્સ્ટ પ્રદર્શિત કરવા માટે દસ્તાવેજીકરણ અને ઉદાહરણો.

કોઈપણ સમયે તમારે સામગ્રીનો ભાગ પ્રદર્શિત કરવાની જરૂર હોય—જેમ કે વૈકલ્પિક કૅપ્શન સાથેની છબી, ઉપયોગ કરવાનું વિચારો <figure>.

HTML5 અને તત્વો માટે કેટલીક આધારરેખા શૈલીઓ પ્રદાન કરવા માટે સમાવિષ્ટ .figure, .figure-imgઅને વર્ગોનો ઉપયોગ કરો. આકૃતિઓમાંની છબીઓનું કોઈ સ્પષ્ટ કદ હોતું નથી, તેથી તેને પ્રતિભાવ આપવા માટે તમારામાં વર્ગ ઉમેરવાની ખાતરી કરો ..figure-caption<figure><figcaption>.img-fluid<img>

400x300
ઉપરોક્ત છબી માટે કૅપ્શન.
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

આકૃતિના કૅપ્શનને સંરેખિત કરવું અમારી ટેક્સ્ટ ઉપયોગિતાઓ સાથે સરળ છે .

400x300
ઉપરોક્ત છબી માટે કૅપ્શન.
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption text-right">A caption for the above image.</figcaption>
</figure>