html雪花飘落代码
时间: 2023-09-29 12:05:43 浏览: 155
很高兴为您提供HTML雪花飘落的代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>雪花飘落效果</title>
<style>
body {
overflow: hidden;
}
.snowflake {
position: absolute;
color: #fff;
font-size: 18px;
pointer-events: none;
user-select: none;
}
</style>
</head>
<body>
<script>
function createSnowflake() {
const snowflake = document.createElement('span');
snowflake.innerHTML = '❄';
snowflake.classList.add('snowflake');
snowflake.style.left = Math.random() * window.innerWidth + 'px';
snowflake.style.animationDuration = Math.random() * 3 + 2 + 's';
document.body.appendChild(snowflake);
setTimeout(() => {
snowflake.remove();
}, 5000);
}
setInterval(createSnowflake, 200);
</script>
</body>
</html>
```
将以上代码保存为一个HTML文件,然后在浏览器中打开该文件,您将看到雪花飘落的效果。希望能对您有所帮助!
阅读全文