Mine põhisisu juurde Jätke dokumentide navigeerimise juurde
Check

Dokumentatsioon ja näited seotud piltide ja teksti kuvamiseks Bootstrapis joonise komponendiga.

Sellel lehel

Iga kord, kui teil on vaja kuvada sisu, näiteks valikulise pealkirjaga pilti, kaaluge <figure>.

Kasutage kaasatud .figure, .figure-imgja klasse, et pakkuda HTML5 ja elementide .figure-captionjaoks mõningaid põhistiile . Joonistel kujutatud piltidel pole selget suurust, seega lisage klass kindlasti oma klassi, et see reageeriks.<figure><figcaption>.img-fluid<img>

Placeholder 400x300
Ülaltoodud pildi pealkiri.
html
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

Joonise pealdise joondamine on meie tekstiutiliitidega lihtne .

Placeholder 400x300
Ülaltoodud pildi pealkiri.
html
<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption text-end">A caption for the above image.</figcaption>
</figure>

Sass

Muutujad

$figure-caption-font-size:          $small-font-size;
$figure-caption-color:              $gray-600;