CSS perspective-origin egenskap

Definition och användning

perspective-origin-egenskapen definierar X- och Y-axeln som 3D-elementet baseras på. Denna egenskap tillåter dig att ändra 3D-elementets bottenposition.

När perspective-origin-egenskapen definieras för ett element, får dess underliggande element perspektiveffekten, inte elementet självt.

Kommentar:Denna egenskap måste användas tillsammans med perspektiv Används tillsammans med egenskaper och påverkar endast 3D-omvandlingselement.

Se också:

CSS3 Tutorial:CSS3 3D omvandling

HTML DOM Referenshandbok:perspectiveOrigin-egenskapen

Exempel

Ange baspositionen för 3D-elementet:

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

Prova själv

CSS-syntax

perspective-origin: x-axel y-axel;

Egenskapsvärde

Värde Beskrivning
x-axel

Definierar positionen för denna vy på x-axeln. Standardvärde: 50%.

Möjliga värden:

  • vänster
  • centrerad
  • höger
  • längd
  • %
y-axel

Definierar positionen för denna vy på y-axeln. Standardvärde: 50%.

Möjliga värden:

  • topp
  • centrerad
  • botten
  • längd
  • %

Tekniska detaljer

Standardvärde: 50% 50%
Arvsförmåga: nej
Version: CSS3
JavaScript-syntax: object.style.perspectiveOrigin="10% 10%"

Webbläsarstöd

Tal i tabellen anger den första webbläsare som helt stöder egenskapen.

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-