Sifa aspect-ratio
Sifa aspect-ratio huweka mpangilio
wa vipengele kwenye mhimili wa kuvuka kwa vizuizi vya flex
na kwenye mhimili mlalo kwa gridi.
Inatumika kwa kipengele
kizazi.
Kiendeshaji
kichagua {
aspect-ratio: auto au uwiano;
}
Thamani
| Thamani | Maelezo |
|---|---|
auto |
Kipengele hakina uwiano wa pande unaopendelewa na kivinjari huweka moja kwa moja, kutokana na upana na urefu wa kipengele. |
uwiano |
Uwiano huandikwa kwa umbo 16/9,
hapa nambari ya kwanza ni upana, na nambari ya pili
ni urefu. Ikiwa thamani fulani haija
bainishwa, basi inachukuliwa kuwa sawa na 1. Pia
baadhi ya uwiano inaruhusiwa kuandikwa
kwa nambari moja. Kwa mfano, 2/1 inaweza kuandikwa
kama 0.5, hii itatoa matokeo sawa. |
auto && uwiano |
Ikiwa uwiano wa pande unakuja pamoja
na neno kuu auto (mfano: auto 1/2),
basi uwiano uliobainishwa utachaguliwa,
lakini kwa vipengele vinavyoweza kubadilishwa (kama vile
picha na video) zilizo na uwiano wao
utatumika tu huo. |
Mfano
Wacha tuweke uwiano wa pande wa kiotomati kwa kifungo:
<p>
<button>Click</button>
</p>
button {
aspect-ratio: auto;
background-color: #9DDFA4;
padding: 1em;
}
:
Mfano
Sasa tuweke uwiano wa pande za kifungo
kama 1/2:
<p>
<button>Click</button>
</p>
button {
aspect-ratio: 1/2;
background-color: #9DDFA4;
padding: 1em;
}
:
Angalia Pia
-
sifa
object-fit,
ambayo inabadilisha kipimo cha vipengele