Untitled
unknown
plain_text
a year ago
1.6 kB
3
Indexable
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="toDo.css"> <title>To-Do List</title> </head> <body> <div class="container"> <h1>To-Do List</h1> <div id="app"> <input type="text" id="taskInput" placeholder="Add a new task..."> <button onclick="addTask()">Add Task</button> <ul id="taskList"></ul> </div> </div> <script src="toDo.js"></script> </body> </html> body { font-family: 'Arial', sans-serif; background-color: #f4f4f4; margin: 0; display: flex; align-items: center; justify-content: center; height: 100vh; } .container { text-align: center; background-color: #fff; padding: 50px; border-radius: 8px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } h1 { color: #333; } #app { margin-top: 20px; } input { padding: 8px; margin-right: 8px; } button { padding: 8px; cursor: pointer; background-color: black; color: white; } ul { list-style-type: none; padding: 0; margin: 0; text-align: left; } li { display: flex; justify-content: space-between; align-items: center; padding: 10px; border: 1px solid #ddd; margin-top: 5px; border-radius: 4px; } li button { margin-left: 10px; cursor: pointer; } .completed { text-decoration: line-through; color: #888; }
Editor is loading...
Leave a Comment