manuel de référence CSS

règles CSS @

大全 des attributs CSS

CSS3 Attribut transition CSS3 transform-Attribut origin

CSS3 transform-Méthode d'utilisation et exemple de l'attribut style

transform-L'attribut style CSS spécifie où les éléments enfants de l'élément doivent être positionnés3s'il est placé dans l'espace D ou collé dans le plan de l'élément. Si aplati, les éléments enfants ne seront pas indépendants dans l'espace tridimensionnel.

Cette propriété ne s'applique qu'aux élémentstransformÉlément enfant de l'attribut spécifié.

Le tableau suivant décrit l'utilisation et l'historique des versions de cette propriété, ainsi que la syntaxe d'utilisation de cette propriété dans le script JavaScript.

Valeur par défaut :	flat
Appliqué à :	Élément déformable
Héritage :	Aucun
Animable :	Non.Voir également Attribut d'animation。
Version :	CSS3nouvelle fonctionnalité
JavaScript syntaxe :	object.style.transformStyle="preserve-3d"

transform-Syntaxe d'utilisation de style

La syntaxe de cette propriété est la suivante :

transform-style:　flat　|　preserve-3d　|　initial　|　inherit

Les exemples suivants montrent comment utiliser transform-Attribut style.

Exemple

img　{
　　　　/*　Chrome,　Safari,　Opera　*/
　　　　-webkit-transform:　rotate(30deg);
　　　　-webkit-transform-style:　preserve-3d;
　　　　/*　Firefox　*/
　　　　-moz-transform:　rotate(30deg);
　　　　-moz-transform-style:　preserve-3d;
　　　　/*　IE　9　*/
　　　　-ms-transform:　rotate(30deg);
　　　　-ms-transform-style:　preserve-3d;
　　　　
　　　　transform:　rotate(30deg);
　　　　transform-style:　preserve-3d;
}

Voyons voir‹/›

Valeur de l'attribut

Le tableau suivant décrit les valeurs de cette propriété.

Valeur	Description
flat	Les éléments enfants de l'élément sont aplatis, c'est-à-dire situés dans le plan de l'élément lui-même. C'est la valeur par défaut.
preserve-3d	Les éléments enfants de l'élément doivent être placés dans3Dans l'espace D.
initial	Réinitialisez cette propriété à sa valeur par défaut.
inherit	Si spécifié, l'élément lié utilise le transform de son élément parent-Valeur de l'attribut style.

Compatibilité du navigateur

transform-La compatibilité du navigateur de l'attribut style, les numéros dans le tableau suivant indiquent la version minimale du navigateur qui prend en charge cette propriété ; tous les navigateurs populaires prennent en charge cette propriété.

	Firefox 10+ ^-moz-，16 + Chrome 12+ ^-webkit-，36+ Internet Explorer 11+ Apple Safari 4+ ^-webkit- Opera 15+ 　 ^-webkit-，23+

Pour en savoir plus

Veuillez consulter les tutoriels suivants :CSS3 2Transformation D，CSS3 3Transformation D

Attributs associés :backface-visibility，perspective，perspective-origin，transform，transform-origin。

CSS3 Attribut transition CSS3 transform-Attribut origin