HTML 时钟背景代码 - 简单易懂示例 - 常规

<!DOCTYPE html>
<html>
<head>
  <title>时钟背景</title>
  <style>
    body {
      background-color: #000;
      color: #fff;
      font-family: Arial, sans-serif;
      text-align: center;
      padding: 100px;
    }
<pre><code>#clock {
  font-size: 80px;
}
</code></pre>
  </style>
</head>
<body>
  <div id="clock"></div>
  <script>
    function updateClock() {
      var now = new Date();
      var hours = now.getHours();
      var minutes = now.getMinutes();
      var seconds = now.getSeconds();
      
      hours = hours.toString().padStart(2, '0');
      minutes = minutes.toString().padStart(2, '0');
      seconds = seconds.toString().padStart(2, '0');
      
      var time = hours + ":" + minutes + ":" + seconds;
      
      document.getElementById("clock").textContent = time;
      
      setTimeout(updateClock, 1000);
    }
    
    updateClock();
  </script>
</body>
</html>
这个代码创建了一个简单的时钟背景，使用黑色作为背景颜色，白色作为文字颜色，并居中显示。使用JavaScript获取当前时间，并将其显示在页面上的一个`div`元素中。通过调用`setTimeout`函数，每秒钟更新一次时间。
<p>你可以将这段代码保存为一个HTML文件，然后在浏览器中打开它，就可以看到时钟背景了。希望对你有帮助！</p>