<!DOCTYPE html>
<html>
<head>
	<title>动态星空</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: black;
		}
		.star {
			position: absolute;
			background-color: white;
			border-radius: 50%;
			animation: star 1s linear infinite;
		}
		@keyframes star {
			0% {
				transform: scale(0);
				opacity: 1;
			}
			50% {
				transform: scale(1);
				opacity: 0.5;
			}
			100% {
				transform: scale(0);
				opacity: 1;
			}
		}
	</style>
</head>
<body>
	<script>
		function createStar() {
			let star = document.createElement("div");
			star.className = "star";
			star.style.top = Math.random() * window.innerHeight + "px";
			star.style.left = Math.random() * window.innerWidth + "px";
			document.body.appendChild(star);
			setTimeout(function() {
				star.remove();
			}, 1000);
		}
		setInterval(createStar, 100);
	</script>
</body>
</html

原文地址: https://www.cveoy.top/t/topic/fsFC 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录