<!-- 時計を作る -->
<html lang="ja">

<head>
	<meta charset="utf-8">
	<title>時計</title>
	<style>
		body {
			background-color: #000;
		}

		#clock {
			color: #fff;
			font-size: 100px;
			font-family: 'Orbitron', sans-serif;
			text-align: center;
			margin: 0 auto;
			padding-top: 100px;
		}
	</style>
</head>

<body>
	<div id="clock"></div>
	<script>
		// 日にちを表示する
		function showClock() {
			var nowTime = new Date();
			var nowYear = nowTime.getFullYear();
			var nowMonth = nowTime.getMonth() + 1;
			var nowDate = nowTime.getDate();
			var nowHour = nowTime.getHours();
			var nowMin = nowTime.getMinutes();
			var nowSec = nowTime.getSeconds();
			var msg = nowYear + '年' + nowMonth + '月' + nowDate + '日' + nowHour + '時' + nowMin + '分' + nowSec + '秒';
			document.getElementById("clock").innerHTML = msg;
		}
		setInterval('showClock()', 1000);
	</script>
</body>

</html>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.