Animation d'arbre de Noël en utilisant le code HTML CSS et JS-js tutoriel-php.cn

Animation d'arbre de Noël en utilisant le code HTML CSS et JS

Mary-Kate Olsen

Libérer： 2024-12-27 22:16:11

original

961 Les gens l'ont consulté

Christmas Tree animation using html css and js code

<!DOCTYPE html>
<html lang="fr">
<tête>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Sapin de Noël 3D</title>
  <style>
    corps {
      affichage : flexible ;
      justifier-contenu : centre ;
      aligner les éléments : centre ;
      hauteur : 100vh ;
      marge : 0 ;
      couleur d'arrière-plan : #000 ;
      perspective : 1000px ; /* Ajouter une perspective à la scène */
    }
    .arbre {
      position : relative ;
      style de transformation : préserver-3d ; /* S'assure que les enfants sont rendus dans l'espace 3D */
      transformation : rotationX(30deg); /* Faites pivoter l'arbre pour qu'il soit dans la bonne direction */
    }
    .étoile {
      position : absolue ;
      taille de police : 12 px ;
      opacité : 0 ;
      animation : scintille pendant 1 s en alternance infinie, apparaît 5 s vers l'avant ;
    }
    @keyframes scintillent {
      de { opacité : 1 ; }
      à { opacité : 0,5 ; }
    }
    Les @keyframes apparaissent {
      de { opacité : 0 ; }
      à { opacité : 1 ; }
    }
  </style>
&Lt;/tête>
<corps>
  <div>

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!