Beginner · 5h 53m · 22 lessons
HTML & CSS
Build real web pages from scratch: structure them with HTML, then style them with CSS.
What you'll learn
- ✦Write a valid HTML document from scratch and explain what every part of the boilerplate does
- ✦Structure content with the right elements: headings, paragraphs, links, images, and lists
- ✦Choose semantic tags like
<header>,<nav>,<main>, and<footer>so every part of a page has meaning - ✦Build accessible forms with linked labels, the right input types, and a working submit button
- ✦Target elements with CSS selectors and work out which rule wins using the cascade and specificity
- ✦Control spacing and sizing with the box model, and pick the right unit (px, rem, %, vw) for the job
- ✦Lay out pages with flexbox and CSS grid instead of fighting with floats
- ✦Make any layout responsive with media queries so it looks great on every screen
- ✦Polish pages with positioning, transitions, hover states, and CSS variables
- ✦Assemble real layout patterns, work mobile-first, and debug CSS in DevTools
Part of these career paths
- Frontend Developer path · course 1 of 8
- Full-Stack Developer path · course 1 of 14
Certification projects
Build 4 projects to earn your certificate
Hands-on work that proves you can apply what you learned — part of the certificate requirements.
Syllabus
Module 1 · 1h 1m
HTML: the structure of the web Free
What you'll be able to do
- Explain what HTML does and does not do, and write it with no install needed.
- Build elements correctly with matching tags and attributes, including void elements.
- Write a valid page boilerplate and explain the job of every line in it.
- Mark up headings, paragraphs, links, images, and lists with the right elements.
Module 2 · 51m
Semantic HTML & forms Locked
What you'll be able to do
- Choose semantic tags over generic divs so a page's structure carries meaning.
- Build a form with linked labels and the right input type for each field.
- Use browser validation and fieldsets to guide the user without extra code.
Module 3 · 1h 36m
CSS: making it beautiful Locked
What you'll be able to do
- Write a CSS rule and link a stylesheet to an HTML page.
- Target elements with selectors and predict which rule wins using the cascade.
- Choose colors, sizing units, and type sensibly for the job.
- Calculate an element's rendered size from its content, padding, and border.
- Style a real card in a live sandbox and see the change instantly.
Module 4 · 1h 7m
Layout that works anywhere Locked
What you'll be able to do
- Explain why block and inline elements behave differently, and change it with display.
- Align and space a row of items with flexbox.
- Build a two-dimensional layout of rows and columns with grid.
- Make a layout respond to screen size with media queries.
Module 5 · 39m
Polished CSS Locked
What you'll be able to do
- Position an element and predict how it stacks with z-index.
- Animate a property smoothly between two states with a transition.
- Declare and reuse a custom property across a stylesheet.
Module 6 · 39m
Layouts that scale Locked
What you'll be able to do
- Assemble a page from common layout patterns instead of starting from scratch.
- Build a layout mobile-first, adding styles as the screen grows.
- Read DevTools' Styles and Computed panels to debug a CSS rule that isn't applying.