CSS Basics

Free · no account needed to read

CSS is where a plain page becomes something a child is proud to show someone. It is also where a lot of adults get lost, because the rules are invisible until you see them applied.

The lessons keep the preview beside the code at all times, so a change to a colour, a margin or a border shows itself immediately rather than being described in the abstract.

Start this course free

What your child will learn

  • Selectors and how CSS finds an element
  • Colours and backgrounds
  • Fonts and text styling
  • The box model: margin, border, padding
  • Classes and ids
  • Layout basics
  • Hover and simple interactivity

How the course is organised

  1. Welcome to CSS!
  2. Styling Your Page
  3. Layout, Selectors & Interactivity

Read a lesson before you sign up

Full lessons from this course are readable here, with no account - the explanation, a worked example and the mistakes children usually make:

How the lessons work

Each lesson opens with the child’s own coding buddy explaining the idea. The explanation is spoken aloud, typed on screen and performed by an animation at the same time - the same sentence in all three, so a child who reads slowly can listen, and a child who is not reading at all can watch.

After the explanation come the practice games: spot the bug, predict the output, order the code, and a written challenge that runs the child’s real code and checks it.

Questions parents ask

Should my child learn HTML before CSS?

Yes - CSS styles HTML, so there needs to be something to style first. The HTML course here is 19 short lessons and is the natural thing to do immediately before this one.

Other courses