CSS object-position 属性

Paglilinang at paggamit

Ang katangian ng object-position na pinagsama-sama sa object-fit ay nagpapahiwatig kung paano gamitin ang koordinadong x/y para sa <img> o <video> sa kanilang sariling kahon ng nilalaman.

Bilang karagdagan:

Tuturo ng CSS:CSS object-fit

Manwal ng CSS:CSS object-position

Manwal ng HTML DOM:Katangian ng objectPosition

Mga halimbawa

Ayusin ang laki ng imahe upang sumuporta sa kahon ng nilalaman, at ilihis ang posisyon ng imahe sa loob ng kahon ng nilalaman mula sa kaliwa ng 5px at mula sa itaas ng 10%:

img.a {
  width: 200px;
  height: 400px;
  object-fit: none;
  object-position: 5px 10%;
  border: 5px solid red;
}

Subukan nang personal

Grammar ng CSS

object-position: position|initial|inherit;

Halaga ng katangian

Halaga Paglalarawan
position

Tutukoy ang posisyon ng imahe o video sa loob ng kahon ng nilalaman.

Ang unang halaga ay kontrolin ang x-aks, ang ikalawang halaga ay kontrolin ang y-aks.

Maaaring maging string (left, center o right) o numero (sa bawat px o %). Pinapayagan ang mga negatibong halaga.
initial I-set ang katangian sa kanyang default na halaga. Tingnan ang: initial.
inherit Mumunuan ang katangian mula sa magulang na elemento. Tingnan ang: inherit.

Detalye ng teknolohiya

Default na halaga: 50% 50%
Inherits: Oo
Gawa ng animasyon: Sumusuporta. Tingnan ang:Katangian ng animasyon.
Versyon: CSS3
Grammar ng JavaScript: object.style.objectPosition="0 10%"

Suporta ng browser

Ang mga numero sa talahanayan ay nagpapahiwatig na ang unang browser na ganap na sumusuporta sa katangian.

Chrome IE / Edge Firefox Safari Opera
31.0 16.0 36.0 10.0 19.0