html5实现星空特效

HTML5 可以通过 Canvas 元素来实现星空特效。以下是一个简单的实现：

1. 在 HTML 页面中添加一个 Canvas 元素。例如：

<canvas id="myCanvas" style="background-color: black;"></canvas>

2. 在 JavaScript 中编写绘制星空特效的函数 draw()。该函数应该首先获取 Canvas 元素，并为其设置宽度和高度。然后，函数应该在 Canvas 上绘制多个随机位置和大小的白色圆点，以模拟星空效果。例如：

function draw() {
  var canvas = document.getElementById("myCanvas");
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;
  var ctx = canvas.getContext("2d");
  ctx.fillStyle = "white";
  for (var i = 0; i < 100; i++) {
    var x = Math.random() * canvas.width;
    var y = Math.random() * canvas.height;
    var r = Math.random() * 2;
    ctx.beginPath();
    ctx.arc(x, y, r, 0, 2 * Math.PI);
    ctx.fill();
  }
}

在 JavaScript 中编写一个定时器，以定期更新 Canvas 上的星空特效。例如：

setInterval(draw, 100);

这样，当页面加载时，星空特效将会自动启动并在 Canvas 上绘制。 需要注意的是，以上代码仅仅是一个简单的示例，实际的星空特效可能需要更加复杂的代码来实现。此外，你还可以通过调整圆点的颜色、大小、透明度等属性，以及在 Canvas 上添加其他元素，来进一步定制星空特效。