182 of 313 menu

Хосияти object-fit

Хосияти object-fit нисбати тарафҳо ё масштаббандии элементҳое чун тасвир ё видеоро муайян мекунад.

Синтаксис

интихобкунанда { object-fit: fill ё contain ё cover ё none; }

Дар ҷадвал арзишҳои асосӣ барои хосияти object-fit пешниҳод шудаанд:

Арзишҳо

Арзиш Тавсиф
fill Масштаббандии элемент барои мувофиқат ба андозаҳои додашуда, дар ҳоле ки нисбати тарафҳои элемент нодида гирифта мешавад.
contain Масштаббандии элемент барои мувофиқат ба андозаҳои додашуда, дар ҳоле ки нисбати тарафҳои элемент нигоҳ дошта мешавад.
cover Андозаҳои элемент тағйир дода мешаванд, то ки пурра пур кунанд минтақаи муайянкардаро, дар ҳоле ки нисбати тарафҳои худи элемент нигоҳ дошта мешавад.
none Андозаҳои ибтидоии элемент нигоҳ дошта мешаванд.

Намуна

Биёед ба тасвири мо пуркунии андозаи муайянкардаро бе нигоҳдории нисбати тарафҳо таъин кунем:

<div> <img src="bg.png"> </div> img { object-fit: fill; height: 400px; width: 300px; border: 1px solid black; }

:

Намуна

Ва акнун биёед чунон кунем, ки тасвир пур кунад контейнери муайянкардаро бо нигоҳдории нисбати тарафҳо:

<div> <img src="bg.png"> </div> img { object-fit: contain; height: 400px; width: 300px; border: 1px solid black; }

:

Намуна

Биёед тасвири моро бо контейнери муайянкарда чунон пур кунем, ки андозаи худи тасвир тағйир ёбад, аммо дар ҳоле ки нисбати тарафҳои он нигоҳ дошта шавад:

<div> <img src="bg.png"> </div> img { object-fit: cover; height: 400px; width: 300px; border: 1px solid black; }

:

Намуна

Биёед танҳо тасвири моро ҷойгир кунем дар контейнери муайянкарда бо нигоҳдории андозаҳои ибтидоии он:

<div> <img src="bg.png"> </div> img { object-fit: none; height: 400px; width: 300px; border: 1px solid black; }

:

Ҳамчунин бубинед

  • хосияти aspect-ratio,
    ки нисбати тарафҳои элементро муайян мекунад
Тоҷикӣ
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Мо барои коркарди сомона, таҳлил ва шахсӣ кардан аз cookie истифода мебарем. Коркарди маълумот мувофиқи Сиёсати махфият сурат мегирад.
ҳамаро қабул кардан танзим кардан рад кардан