Page 310 - Web Applications (803) Class 12
P. 310
File1: Index.html
<html>
<head>
<title>Digital Clock</title>
<link rel=”stylesheet” href=”styles.css”>
</head>
<body>
<div class=”clock”>
<h1>Welcome to the Digital Clock</h1>
<div class=”time” id=”time”></div>
</div>
<script src=”Pscript.js”></script>
</body>
</html>
File2: styles.css
body {
font-family: sans-serif;
background-color: pink;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
.clock {
background-color: blue;
padding: 20px;
border-radius: 10px;
text-align: center;
}
.time {
font-size: 2rem;
}
File3: Pscript.js
function updateTime() {
const timeElement = document.getElementById(‘time’);
const now = new Date();
308 Touchpad Web Applications-XII

