Exemplu
Setați plasarea unui element de bază 3D:
div
{
-webkit-perspective: 150px; /* Chrome, Safari, Opera */
-webkit-perspective-origin: 10% 10%; /* Chrome, Safari, Opera */
perspective: 150px;
perspective-origin: 10% 10%;
}
Încearcă - l singur » Definiție și utilizare
Proprietatea perspectivă definește originea în cazul în care un element 3D se bazează pe axele X și axa y. Această proprietate vă permite să schimbați poziția de jos a elementelor 3D.
La definirea proprietății de perspectivă origine pentru un element, este elementele de copil pe care sunt poziționate, nu elementul în sine.
Note: Această proprietate trebuie să fie utilizat împreună cu perspectiva de proprietate, și afectează numai 3D transformat elemente!
Pentru a înțelege mai bine proprietatea perspectiva-origine, o demonstrație .
Valoare implicită: | 50% 50% |
---|---|
Mostenit: | no |
Animatable: | yes. Read about animatable Try it |
Versiune: | CSS3 |
sintaxa JavaScript: | object .style.perspectiveOrigin="10px 50%" Try it |
Suport pentru browser-
Numerele din tabel specifica prima versiune de browser care acceptă pe deplin proprietatea.
Numerele urmat de -webkit- sau -moz- specifica prima versiune care a lucrat cu un prefix.
Proprietate | |||||
---|---|---|---|---|---|
perspective-origin | 36,0 12,0 -webkit- | 10.0 | 16.0 10.0 -moz- | 9 4.0.3 -webkit- | 23.0 15,0 -webkit- |
CSS Sintaxa
perspective-origin: Valori de proprietate Valoarea proprietății Descriere x-axis Definindu vizualizarea este plasată la axa x Valori posibile:
- stânga
- centru
- dreapta
- length
- %
Valoare implicită: 50%
y-axis Definindu vizualizarea este plasat la axa y Valori posibile:
- top
- centru
- fund
- length
- %
Valoare implicită: 50%
iniţială Setează această proprietate la valoarea implicită. Citiți despre inițială moşteni Mosteneste această proprietate de la elementul părinte. Citiți despre moștenesc
Pagini similare
Tutorial CSS: CSS 3D Transformări
HTML DOM referință: perspectiveOrigin property