figure-caption
bootstrap5.css
bootstrap5.css
.figure-caption {
font-size: 90%;
color: #6c757d;
}
html bootstrap5 Sample
図とキャプション:figure-caption
<figure class="figure">
<img src="https://via.placeholder.com/400x300/FFFF00/000000?text=img" class="figure-img img-fluid" alt="図表の画像">
<figcaption class="figure-caption">図表キャプション</figcaption>
</figure>
図表キャプション左寄せ(デフォルト):text-left
<figure class="figure">
<img src="https://via.placeholder.com/400x300/FFFF00/000000?text=img" class="figure-img img-fluid" alt="図表の画像">
<figcaption class="figure-caption text-left">図表キャプション左寄せ(デフォルト)(text-left:デフォルト)</figcaption>
</figure>
図表キャプション中央寄せ:text-center
<figure class="figure">
<img src="https://via.placeholder.com/400x300/FFFF00/000000?text=img" class="figure-img img-fluid" alt="図表の画像">
<figcaption class="figure-caption text-center">図表キャプション中央寄せ(text-center)</figcaption>
</figure>
図表キャプション右寄せ:text-right
<figure class="figure">
<img src="https://via.placeholder.com/400x300/FFFF00/000000?text=img" class="figure-img img-fluid" alt="図表の画像">
<figcaption class="figure-caption text-right">図表キャプション右寄せ(text-right)</figcaption>
</figure>