首页帮我写一个炫丽多彩的html星空页面

帮我写一个炫丽多彩的html星空页面

时间: 2023-12-18 22:03:47 浏览: 73

html实现酷炫星空可视化大屏源码

5星 · 资源好评率100%

资源描述： html实现酷炫星空可视化大屏源码，html大屏源码，可视化大屏，星空穿越，酷炫的界面效果，灵活的模块配置，打造属于自己的酷炫大屏，F11全屏打开页面，Ctrl+鼠标滚轮，找到最合适的分辨率，展现最好的界面效果。支持扩展界面，功能，灵活改变版块样式。说明地址： https://blog.csdn.net/weixin_43151418/article/details/130884793

<!DOCTYPE html> <html> <head> <title>炫丽多彩的星空</title> <style> body { background-color: black; } .star { position: absolute; width: 3px; height: 3px; border-radius: 50%; background-color: white; animation: sparkle 1s infinite; z-index: -1; } #star1 { top: 10%; left: 50%; animation-delay: 0.1s; } #star2 { top: 20%; left: 70%; animation-delay: 0.2s; } #star3 { top: 30%; left: 30%; animation-delay: 0.3s; } #star4 { top: 40%; left: 80%; animation-delay: 0.4s; } #star5 { top: 50%; left: 10%; animation-delay: 0.5s; } #star6 { top: 60%; left: 90%; animation-delay: 0.6s; } #star7 { top: 70%; left: 20%; animation-delay: 0.7s; } #star8 { top: 80%; left: 60%; animation-delay: 0.8s; } #star9 { top: 90%; left: 40%; animation-delay: 0.9s; } @keyframes sparkle { 0% { opacity: 0; } 50% { opacity: 1; transform: scale(1.5); } 100% { opacity: 0; } } </style> </head> <body> <div id="star1" class="star"></div> <div id="star2" class="star"></div> <div id="star3" class="star"></div> <div id="star4" class="star"></div> <div id="star5" class="star"></div> <div id="star6" class="star"></div> <div id="star7" class="star"></div> <div id="star8" class="star"></div> <div id="star9" class="star"></div> </body> </html>

阅读全文