Figūros

Dokumentacija ir pavyzdžiai, kaip rodyti susijusius vaizdus ir tekstą su figūros komponentu „Bootstrap“.

Kaskart, kai reikia rodyti turinio dalį, pvz., vaizdą su pasirenkama antrašte, apsvarstykite galimybę naudoti <figure>.

Naudokite įtrauktas .figure, .figure-imgir .figure-captionklases, kad pateiktumėte kai kuriuos pradinius HTML5 <figure>ir <figcaption>elementų stilius. Paveikslėliai neturi aiškaus dydžio, todėl būtinai pridėkite .img-fluidklasę prie savo <img>, kad ji atitiktų.

<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>

Paveikslo antraštę sulygiuoti paprasta naudojant mūsų teksto priemones .

<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>