好的,这是一个使用 HTML 和 CSS 制作的元旦快乐动画:
<html>
<head>
<style>
/* 定义动画样式 */
@keyframes bounce {
0% {
transform: translateY(0);
}
50% {
transform: translateY(-30px);
}
100% {
transform: translateY(0);
}
}
/* 定义文本样式 */
.text {
font-size: 48px;
font-weight: bold;
color: red;
animation: bounce 2s infinite;
}
</style>
</head>
<body>
<!-- 显示文本 -->
<div class="text">元旦快乐!</div>
</body>
</html>
在这个例子中,我们使用了 HTML 的 div
元素来显示文本,并使用了 CSS 的 animation
属性来添加动画效果。这个动画会不断循环播放,文本会上下弹跳。
希望这个示例能帮到你!