perspective()
La fonction perspective() définit la distance entre le plan d'équation z = 0 (voir <transform-fonction>) et l'œil de l'utilisateur afin de fournir une perspective aux éléments positionnés dans l'espace 3D. Chaque élément pour lequel z est positif apparaîtra plus grand et chaque élément pour lequel z est négatif apparaîtra plus petit. La force de cet effet est déterminée par la valeur de cette propriété.Cette fonction accepte comme paramètre une valeur de longueur qui définit la distance entre l'œil de l'utilisateur et le plan décrit par l'équation z = 0. Si la valeur est nulle ou négative, aucune perspective ne sera appliquée.
<style>
.fond {
width: 300px;
height: 300px;
border: 1px dotted black;
}
.carre {
width: 300px;
height: 300px;
background-color: cyan;
}
.carre2 {
width: 300px;
height: 300px;
background-color: cyan;
transform: perspective(800px) rotatey(45deg);
}
</style>
<div class="fond">
<div class="carre"></div>
</div>
<br><br>
<div class="fond">
<div class="carre2"></div>
</div>