in English
Зураг
Bootstrap дээрх зургийн бүрэлдэхүүн хэсэгтэй холбоотой зураг, текстийг харуулах баримт бичиг, жишээ.
Энэ хуудсан дээр
Нэмэлт тайлбартай зураг гэх мэт контентыг харуулах шаардлагатай үедээ <figure>
.
Оруулсан .figure
, .figure-img
болон .figure-caption
ангиудыг ашиглан HTML5 <figure>
болон <figcaption>
элементүүдийн үндсэн хэв маягийг өгнө үү. .img-fluid
Зурган дээрх зургууд нь тодорхой хэмжээтэй байдаггүй тул үүнийг хариу үйлдэл үзүүлэхийн тулд ангидаа оруулахаа мартуузай <img>
.
<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>
Сасс
Хувьсагч
$figure-caption-font-size: $small-font-size;
$figure-caption-color: $gray-600;