
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | <!DOCTYPE html>
<html lang= "de" >
<Kopf>
<meta charset= "UTF-8" >
<meta name= "viewport" content= "width=device-width, initial-scale=1.0" >
<title>3D-Weihnachtsbaum</title>
<Stil>
Körper {
Anzeige: Flex;
rechtfertigen-Inhalt: Mitte;
align-items: center;
Höhe: 100 Vh;
Rand: 0;
Hintergrundfarbe: #000;
Perspektive: 1000px;
}
.Baum {
Position: relativ;
Transformationsstil: Preserve-3d;
transformieren: rotateX(30deg);
}
.Stern {
Position: absolut;
Schriftgröße: 12px;
Deckkraft: 0;
Animation: 1 Sekunde lang unendlich abwechselnd blinken, 5 Sekunden lang erscheinen;
}
@keyframes funkeln {
von { Deckkraft: 1; }
bis { Deckkraft: 0,5; }
}
@keyframes erscheinen {
von { Deckkraft: 0; }
zu { Deckkraft: 1; }
}
</style>
</head>
<Körper>
<div>
|
Nach dem Login kopieren
Das obige ist der detaillierte Inhalt vonWeihnachtsbaum-Animation mit HTML-CSS- und JS-Code. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!