Chapter 01
App, Not Just a Page
Plan the quiz app's screens and set up a project that feels like real app-building, not just another page.
Back to courses
Quiz App Studio: Level Up Your HTML & CSS
Take your HTML and CSS further by building something that looks and feels like a real app: a quiz with a start menu, question cards, answer buttons and a score bar. Flexbox, Grid, button states and animation — finished and presented on Demo Day.
Can follow a lesson and type comfortably
What you'll learn
- Build a multi-screen app interface with semantic HTML
- Lay it out with Flexbox and CSS Grid, responsive on phone and laptop
- Design buttons and their states: hover, selected, correct and wrong
- Use classes and IDs as the hooks that code will control
- Add transitions and a simple animation to make it feel alive
- Debug with Developer Tools and present on Demo Day
The course journey
What your child will explore
Follow the course from the first idea to the finished project.
- Chapter 02
Clean Bones: Semantic HTML
Rebuild your HTML with proper semantic tags so browsers, screen readers and teammates all understand your quiz.
- Chapter 03
Hooks for Code: Classes & IDs
Label your elements with classes and IDs, the hooks your styles and future code will grab onto.
There's more to explore
Create an account or log in to see all 10 chapters.