Số liệu

Tài liệu và ví dụ để hiển thị hình ảnh và văn bản liên quan với thành phần figure trong Bootstrap.

Bất cứ khi nào bạn cần hiển thị một phần nội dung — chẳng hạn như một hình ảnh với chú thích tùy chọn, hãy cân nhắc sử dụng một <figure>.

Sử dụng các lớp và được .figurebao gồm để cung cấp một số kiểu đường cơ sở cho HTML5 và các phần tử. Hình ảnh trong hình không có kích thước rõ ràng, vì vậy hãy đảm bảo thêm lớp vào của bạn để làm cho nó đáp ứng..figure-img.figure-caption<figure><figcaption>.img-fluid<img>

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

Căn chỉnh chú thích của hình thật dễ dàng với các tiện ích văn bản của chúng tôi .

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