Milestone 02: HTML Skeleton
Write the base HTML document.
5% complete
🎯 Goal
Complete this milestone so the KBC HTML/JavaScript project moves one step closer to the final working app.
🖼 Expected Output SVG
This diagram defines what the project output should include at this milestone.
🔨 Fully Defined Task
What to build
- Open index.html.
- Add doctype, html, head and body tags.
- Add meta charset and viewport.
- Add title: KBC Quiz HTML JS.
- Add h1 text: KBC Quiz.
Acceptance Criteria
- Page opens in browser.
- Browser tab title is correct.
- Heading appears on screen.
Submit to Teacher
- Screenshot of browser.
- Paste your HTML skeleton.
📄 Files and Code Snapshot
Open the complete code up to this milestone:
💻 Code Up To This Point
View milestone 02 code
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>KBC Quiz</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>KBC Quiz</h1>
<script src="app.js"></script>
</body>
</html>style.css
body{font-family:Arial;background:#061533;color:white;margin:0}.app{max-width:1100px;margin:auto;padding:24px}button{cursor:pointer}app.js
console.log('KBC app started');▶ Run This Milestone
Open milestone-code/milestone-02/index.html in your browser. For best results use VS Code Live Server.
🐞 Debugging Challenge
If this milestone does not work: 1. Check that the correct milestone-code folder is open. 2. Check browser console. 3. Check JSON commas and quotes. 4. Compare with the SVG diagram. 5. Compare with the code snapshot.
🌐 GitHub Commit
git add . git commit -m "Phase 2 milestone 02: HTML Skeleton" git push