html

html星空特效代码怎么写

小亿
276
2023-08-04 00:58:54
栏目: 编程语言

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

<!DOCTYPE html>

<html>

<head>

  <style>

    body {

      background-color: #000;

      overflow: hidden;

    }

    .star {

      position: absolute;

      width: 1px;

      height: 1px;

      background-color: #fff;

    }

  </style>

</head>

<body>

  <script>

    function createStars() {

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

      for (var i = 0; i < numStars; i++) {

        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文件并在浏览器中打开,您将看到一个具有闪烁星星的星空背景。


0
看了该问题的人还看了