Source

Ffigurau

Dogfennaeth ac enghreifftiau ar gyfer arddangos delweddau a thestun cysylltiedig gyda'r gydran ffigwr yn Bootstrap.

Unrhyw bryd y mae angen i chi arddangos darn o gynnwys - fel delwedd gyda chapsiwn dewisol, ystyriwch ddefnyddio <figure>.

.figureDefnyddiwch y , .figure-imga'r dosbarthiadau sydd wedi'u cynnwys .figure-captioni ddarparu rhai arddulliau sylfaenol ar gyfer yr HTML5 <figure>a'r <figcaption>elfennau. Nid oes gan ddelweddau mewn ffigurau unrhyw faint penodol, felly gwnewch yn siŵr eich bod yn ychwanegu'r .img-fluiddosbarth at eich un chi <img>i'w wneud yn ymatebol.

400x300
Capsiwn ar gyfer y ddelwedd uchod.
<figure class="figure">
  <img src=".../400x300" 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>

Mae'n hawdd alinio capsiwn y ffigur â'n cyfleustodau testun .

400x300
Capsiwn ar gyfer y ddelwedd uchod.
<figure class="figure">
  <img src=".../400x300" 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>