温馨提示×

html星空特效代码怎么写

小亿
449
2023-08-04 00:58:54
栏目: 编程语言
前端开发者测试专用服务器限时活动,0元免费领,库存有限,领完即止! 点击查看>>

以下是一个基本的HTML星空特效代码示例:

<!DOCTYPE html>

<html>

<head>

  <style>

    body {

      background-color#000;

      overflow: hidden;

    }

    .star {

      position: absolute;

      width1px;

      height1px;

      background-color#fff;

    }

  </style>

</head>

<body>

  <script>

    function createStars() {

      var numStars = 500; // 星星的数量

      for (var i = 0; i numStarsi++) {

        var star = document.createElement("div");

        star.className = "star";

        star.style.left = Math.random() * 100 + "%";

        star.style.top = Math.random() * 100 + "%";

        star.style.animationDuration = Math.random() * 10 + 5 + "s";

        star.style.animationDelay = Math.random() * 2 + "s";

        document.body.appendChild(star);

      }

    }

    createStars();

  </script>

</body>

</html>

这段代码使用了CSS动画和JavaScript来创建星空特效。将上述代码保存为.html文件并在浏览器中打开,您将看到一个具有闪烁星星的星空背景。

亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>

推荐阅读:c语言烟花特效代码怎么写

0