Hotuna
Takaddun bayanai da misalai don zaɓin hotuna zuwa halayen amsawa (don haka ba su taɓa zama girma fiye da abubuwan iyayensu ba) kuma suna ƙara salo mai nauyi a gare su—duk ta hanyar azuzuwan.
Hotuna masu amsawa
Hotuna a cikin Bootstrap an yi su da amsa tare da .img-fluid
. max-width: 100%;
kuma height: auto;
ana amfani da hoton don ya daidaita tare da kashi na iyaye.
<img src="..." class="img-fluid" alt="...">
Hotunan SVG da Internet Explorer
A cikin Internet Explorer 10 da 11, hotunan SVG tare .img-fluid
da girman su ba su da yawa. Don gyara wannan, ƙara width: 100%;
ko .w-100
inda ya cancanta. Wannan gyara bai dace da girman sauran tsarin hoto ba, don haka Bootstrap baya amfani da shi ta atomatik.
Hotunan hotuna
Baya ga abubuwan amfaninmu na radius na kan iyaka , zaku iya amfani .img-thumbnail
da shi don ba da hoto siffar iyakar 1px zagaye.
<img src="..." class="img-thumbnail" alt="...">
Daidaita hotuna
Daidaita hotuna tare da azuzuwan masu iyo ko azuzuwan daidaita rubutu . block
Hotunan matakin za su iya zama a tsakiya ta amfani da ajin mai amfani da .mx-auto
gefe .
<img src="..." class="rounded float-left" alt="...">
<img src="..." class="rounded float-right" alt="...">
<img src="..." class="rounded mx-auto d-block" alt="...">
<div class="text-center">
<img src="..." class="rounded" alt="...">
</div>
Hoto
Idan kana amfani da <picture>
kashi don tantance <source>
abubuwa da yawa don takamaiman <img>
, tabbatar da ƙara .img-*
azuzuwan zuwa <img>
ba ga <picture>
alamar ba.
<picture>
<source srcset="..." type="image/svg+xml">
<img src="..." class="img-fluid img-thumbnail" alt="...">
</picture>