object-positionVara kasutada koos object-fitvara ja määratleb, kuidas elemendi nagu video või pildi paikneks X / Y koordinaadid sees selle sisu-box. See omadus võtab kaks arvväärtust, näiteks 0 10%või 0 10px. Nendes näidetes näitab esimene number, et pilt tuleks paigutada sisukasti vasakule (0), teine, et see peaks olema ülalt 10% või 10 pikslit. Samuti on võimalik kasutada negatiivseid väärtusi.
Vaikeväärtus object-positionon 50% 50%kasutamisel object-fitvara pilt, nii et vaikimisi kõik pildid paiknema nende sisu kasti, nii:
img ( object-fit: none; object-position: 50% 50%; /* default value: image is centered*/ object-position: 0 0; /* positioned top left of the content box */ )Demo
Allpool on mõned näited selle kohta, kuidas me saame object-positionpildi abil kasutada object-fitatribuudiga seatud none. Kui pildi sisu ei täida mingil põhjusel sisukasti, näitab täitmata ruum elemendi tausta, mis võib olla värviline või isegi a background-image, nagu viimases näites:
Vaadake CodePenil Robin Rendle (@robinrendle) pliiatsiobjekti positsiooni.
Brauseri tugi
| Chrome | Safari | Firefox | Ooper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 31+ | 7,1 + * | 36+ | 26+ | ? | 4.4.4+ | 8,4 + * |
* Toetus, object-fitkuid mitteobject-position