使用html写个元旦快乐代码 有下落的烟花
时间: 2023-02-07 07:33:14 浏览: 118
html css js写一个元旦倒计时代码动态页面
好的,这是一个使用 HTML 写成的元旦快乐代码,带有下落的烟花效果。
```
<html>
<head>
<style>
body {
background-color: black;
}
.firework {
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 5px;
background-color: white;
border-radius: 50%;
animation: fall 1s ease-in-out infinite;
}
@keyframes fall {
0% {
transform: translateY(0);
}
100% {
transform: translateY(100vh);
}
}
</style>
</head>
<body>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
<div class="firework"></div>
</body>
</html>
```
这段代码会在黑色背景上显示 10 个白色的圆圈,它们会从上方下落,模拟烟花的效果。
希望这能帮到你!
阅读全文