首页html写一个很美的烟花表白代码

html写一个很美的烟花表白代码

时间: 2024-01-05 07:20:29 浏览: 150

当然可以！以下是一个简单的HTML代码示例，可以实现一个烟花表白效果： ```html <!DOCTYPE html> <html> <head> <title>烟花表白</title> <style> body { background-color: black; } #firework { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 200px; height: 200px; background-color: red; border-radius: 50%; animation: explode 2s infinite; } @keyframes explode { 0% { transform: translate(-50%, -50%) scale(1); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(10); opacity: 0; } } </style> </head> <body> <div id="firework"></div> </body> </html> ``` 这段代码会在页面中心显示一个红色的圆形元素，通过CSS的动画效果实现了烟花爆炸的效果。你可以将这段代码保存为一个HTML文件，然后在浏览器中打开，就能看到烟花表白的效果了。

阅读全文