Papillon

Sortir

Allez vers la section suivante pour apprendre à retourner l'image d'arrière-plan.

Comment retourner des images d'arrière-plan à l'aide de CSS?

Pour retourner des images d'arrière-plan à l'aide de CSS, appliquez le «transformer»Propriété avec le«scalex" et "d'évolution”Transformez après avoir accédé à l'image ajoutée.

Pour ce faire, suivez la procédure mentionnée.

Étape 1: Style Conteneur Div Main Div
Accédez au conteneur principal Div à l'aide du «identifiant«Selecteur le long du nom d'identification comme«# Flip principal»:

Selon l'extrait de code ci-dessus, les propriétés CSS suivantes ont été appliquées au conteneur:

• "Couleur de l'arrière plan»La propriété est utilisée pour définir une image à l'arrière de l'élément défini.
• "largeur»La propriété spécifie la taille de la largeur d'un élément.
• "hauteur"Est utilisé pour régler la hauteur de l'élément.
• "marge»La propriété alloue de l'espace sur le côté extérieur de la limite définie.

Étape 2: Appliquer le style CSS sur un conteneur intérieur
Accédez au conteneur intérieur à l'aide du nom de classe «.flip intérieur»:

Ensuite, appliquez les propriétés CSS suivantes:

• "position»La propriété spécifie le type de méthode de positionnement utilisé pour un élément
• "alignement de texte"Est utilisé pour définir l'alignement du texte.
• "transition»Les propriétés permettent des éléments pour modifier les valeurs sur une animation et une durée particulières.
• "de style transform»Est utilisé pour spécifier les éléments rendus dans un espace 3D qui sont imbriqués.

Étape 3: Appliquer la propriété «Transformer»
Accédez à l'élément DIV principal avec le nom d'identification le long du «:flotter”Sélecteur et div intérieur à l'aide du nom de classe comme«.flip intérieur»:

Alors:

• Appliquer le "transformer»Propriété pour définir la transformation et définit la valeur de cette propriété comme«Rotatey (180deg)"
• "Rotatey ()”La fonction est utilisée pour faire pivoter l'image dans l'axe y à 180 dedeg.

Étape 4: Définissez «Backface-visibilité»
Accédez aux deux conteneurs Div avec leur nom comme «# Flip avant" et ".flip de retour«Pour définir la visibilité:

Pour ce faire, appliquez les propriétés mentionnées:

• "backface-visibilité»Définit si la face arrière d'un élément doit être visible ou non face à l'utilisateur.
• "couleur»Spécifie la couleur du texte ajouté.
• "Couleur de l'arrière plan”Définit la couleur à l'arrière de l'élément défini.

Sortir

Il s'agit de retourner une image d'arrière-plan en utilisant CSS.

Conclusion

Pour retourner l'image d'arrière-plan à l'aide de CSS, ajoutez d'abord une image à l'aide de "" élément. Ensuite, appliquez les propriétés CSS "transition»Et définissez la valeur. Après cela, appliquez le «transformer«Propriété pour définir la transformation et définir la valeur de cette propriété comme«Rotatey (180deg)», Qui fait pivoter l'image selon la valeur indiquée. Ce message consiste à retourner l'image d'arrière-plan à l'aide de CSS.