Page 314 - Web Applications (803) Class 12
P. 314
PROJECT 8
Simple to-do list app using HTML, CSS and JavaScript.
File1: Index.html
<html>
<head>
<title>To-Do List</title>
<link rel=”stylesheet” href=”styles.css”>
</head>
<body>
<div class=”container”>
<img src=”Image1.jpg” alt=”Image” class=”top-image” height=50%>
<h1>To-Do List</h1>
<div class=”input-container”>
<input type=”text” id=”task” placeholder=”Add a new task...”>
<button id=”add-task”>Add</button>
</div>
<ul id=”task-list”>
<!-- Tasks will be added here -->
</ul>
</div>
<script src=”Pscript.js”></script>
</body>
</html>
File2: styles.css
body {
font-family: Garamond, sans-serif;
background-color: #CBC3E3;
312 Touchpad Web Applications-XII

