CSS perspective ominaisuus

Määrittely ja käyttö

perspective ominaisuus määrittää 3D-elementin etäisyyden näkymään, mitattuna pikseleinä. Tämä ominaisuus mahdollistaa 3D-elementin näkymän muuttamisen.

Kun elementille määritetään perspective ominaisuus, sen lapsielementit saavat perspektiivieffektin, ei itse elementtiä.

Huomautus:perspective ominaisuus vaikuttaa vain 3D-muunneltuihin elementteihin.

Vinkki:Katso myös: perspective-origin Käytä tätä ominaisuutta yhdessä muiden ominaisuuksien kanssa, jotta voit muuttaa 3D-elementin alareunaa.

Katso myös:

CSS3 -opetus:CSS3 3D muunnos

HTML DOM -oppaasti:perspective ominaisuus

esimerkki

Aseta elementin tarkasteltavan sijainnin näkymä:

div
{
perspective: 500;
}

Kokeile itse

CSS-kieli

perspective: number|none;

ominaisuusarvo

arvo kuvaus
number Elementin etäisyys näkymästä, mitattuna pikseleinä.
ei mitään Oletusarvo. Sama kuin 0. Ei aseta perspektiiviä.

Tekninen yksityiskohta

Oletusarvo: ei mitään
Perinnäisyys: kyllä
Versio: CSS3
JavaScript-kieli: object.style.perspective=500

Selaimen tuki

Taulukossa olevat numerot mainitsevat ensimmäisen selaimen version, joka tukee tätä ominaisuutta täysin.

Numerot, jotka sisältävät -webkit- tai -moz- etuliitteen, viittaavat ensimmäiseen versioon, jota etuliite käytetään.

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-