Exemple
Réglez le point de vue à partir duquel un élément est visualisé:
div
{
-webkit-perspective: 500px; /* Chrome, Safari, Opera */
perspective: 500px;
}
Essayez - le vous - même » Définition et utilisation
La propriété en perspective définit le nombre de pixels d'un élément 3D est placé à la vue. Cette propriété vous permet de changer la perspective sur la façon dont les éléments 3D sont considérés.
Lors de la définition de la propriété en perspective d'un élément, ce sont les éléments enfants qui obtiennent la vue en perspective, pas l'élément lui-même.
Note: La propriété en perspective affecte uniquement les éléments 3D transformés!
Tip: Utilisez cette propriété avec la perspective d' origine des biens, ce qui vous permet de changer la position inférieure des éléments 3D.
Pour mieux comprendre la propriété en perspective, voir une démonstration .
| Valeur par défaut: | none |
|---|---|
| Hérité: | no |
| Animable: | yes. Read about animatable Try it |
| Version: | CSS3 |
| Syntaxe JavaScript: | object .style.perspective="50px" Try it |
support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge entièrement la propriété.
Numbers suivis par -webkit- ou -moz- précisent la première version qui a travaillé avec un préfixe.
| Propriété | |||||
|---|---|---|---|---|---|
| perspective | 36,0 12,0 -webkit- | 10.0 | 16,0 10.0 -moz- | 9.0 4.0.3 -webkit- | 23,0 15,0 -webkit- |
Syntaxe CSS
perspective:length|none;propriété valeurs
| Valeur de la propriété | La description |
|---|---|
| length | Dans quelle mesure l'élément est placé dans la vue |
| aucun | Valeur par défaut. Identique à 0. La perspective est pas définie |
| initiale | Définit cette propriété à sa valeur par défaut. Lisez à propos initial |
| hériter | Hérite cette propriété de son élément parent. Lisez à propos de hériteront |
Pages associées
Tutoriel CSS: CSS 3D Transforms
Référence HTML DOM: perspective property