Bootstrap5 图表（Figures）

bootstrap5
内容

当你需要显示内容（例如带有可选标题的图片）时，可以考虑使用<figure>。

使用包含的.fig、.fig-img和.fig-caption为HTML5<figure>和<figcaption>元素提供一些基本样式。图表中的图片没有明确的大小，所以请确保在你的<img>中添加.img-fluid类，使其变为响应式的。

<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

在线运行

使用我们的文本实用工具。可以很容易地对齐图表里的说明。

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

在线运行