Suratlar
Suratlary täsirli alyp barmak üçin resminamalar we mysallar (şonuň üçin olar hiç haçan ene-atasyndan has giň bolmaz) we ýeňil stil goşýarlar - bularyň hemmesi sapaklaryň dowamynda.
Jogaply suratlar
“Bootstrap” -daky suratlar täsirli bolýar .img-fluid
. Bu , ene giňligi bilen tereziniň bolmagy üçin we surata max-width: 100%;
degişlidir .height: auto;
<img src="..." class="img-fluid" alt="...">
Surat suratlary
Serhet-radius hyzmatlarymyzdan başga-da .img-thumbnail
, şekilli tegelek 1px araçäk görnüşini bermek üçin ulanyp bilersiňiz .
<img src="..." class="img-thumbnail" alt="...">
Suratlary deňleşdirmek
Suratlary kömekçi ýüzýän synplar ýa-da tekst tekizlemek synplary bilen deňleşdiriň . derejeli suratlar margin peýdaly synpynyblock
ulanyp merkezleşdirilip bilner.mx-auto
.
<img src="..." class="rounded float-start" alt="...">
<img src="..." class="rounded float-end" alt="...">
<img src="..." class="rounded mx-auto d-block" alt="...">
<div class="text-center">
<img src="..." class="rounded" alt="...">
</div>
Surat
<picture>
Belli bir element üçin birnäçe elementi kesgitlemek <source>
üçin elementi ulanýan bolsaňyz , synplary bellige däl-de, <img>
goşuň ..img-*
<img>
<picture>
<picture>
<source srcset="..." type="image/svg+xml">
<img src="..." class="img-fluid img-thumbnail" alt="...">
</picture>
Sass
Üýtgeýjiler
Surat esbaplary üçin üýtgeýjiler bar.
$thumbnail-padding: .25rem;
$thumbnail-bg: $body-bg;
$thumbnail-border-width: $border-width;
$thumbnail-border-color: $gray-300;
$thumbnail-border-radius: $border-radius;
$thumbnail-box-shadow: $box-shadow-sm;