Programming Academy
Style real pages a rule at a time: colours and fonts, boxes and spacing, Flexbox and Grid layouts, pages that fit phones, and smooth animations, all shown as you type.
43 lessons, about 290 minutes so far · the first 3 lessons free
43 lessons
What CSS is, rules made of selectors and properties, linking a style sheet to a page, and which rule wins.
Style exactly what you mean: classes, ids, groups, what's inside what, hover, and which rule wins.
Colours by name, hex and rgb, backgrounds, fonts with fallbacks, sizes in px and rem, and lining up and dressing text.
Every element is a box: its content, padding, border and margin, how wide it is, centring it, and block or inline.
Line things up in a row or a column: spaced out, centred, wrapping onto new lines. Navbars, cards and more.
Lay things out in rows and columns at once: game boards, photo galleries and whole page layouts.
Pages that work on phones and laptops: the viewport tag, flexible sizes, rem, media queries and thinking mobile first.
Smooth hover effects, things that move, grow and spin, and motion that's kind to everyone who visits.
Put it all together: style a profile card, pricing cards, a landing page, a navbar that fits phones and your own portfolio page.