CSS perspectief-origine eigenschap

Definitie en gebruik

De perspective-origin-eigenschap definieert de X-as en Y-as waarop het 3D-element is gebaseerd. Deze eigenschap maakt het mogelijk om de onderste positie van het 3D-element te wijzigen.

Wanneer de perspective-origin-eigenschap van een element wordt gedefinieerd, krijgen de kindelementen van het element het perspectief, niet het element zelf.

Opmerking:Deze eigenschap moet samen worden gebruikt met perspectief Eigenschappen die samen worden gebruikt en alleen de 3D-converterelementen beïnvloeden.

Zie ook:

CSS3 handleiding:CSS3 3D transformatie

HTML DOM referentiemanual:perspectiveOrigin-eigenschap

Voorbeeld

Stel de basispositie van 3D-elementen in:

div
{
perspectief:150;
perspective-origin: 10% 10%;
}

Probeer het zelf uit

CSS syntaxis

perspective-origin: x-as y-as;

Eigenschapswaarde

Waarde Beschrijving
x-as

Definieert de positie van het perspectief op de x-as. Standaardwaarde: 50%.

Mogelijke waarden:

  • left
  • center
  • right
  • length
  • %
y-as

Definieert de positie van het perspectief op de y-as. Standaardwaarde: 50%.

Mogelijke waarden:

  • top
  • center
  • bottom
  • length
  • %

Technische details

Standaardwaarde: 50% 50%
Inheritance: nee
Versie: CSS3
JavaScript syntaxis: object.style.perspectiveOrigin="10% 10%"

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die de eigenschap volledig ondersteunt.

Chrome IE / Edge Firefox Safari Opera
36.0
12.0 -webkit-		 10.0 16.0
10.0 -moz-		 9.0
4.0.3 -webkit-		 23.0
15.0 -webkit-