UMI202 • Week 7 • Interactive Classroom Demo

CSS Step by Step With Live Code and Live Preview

This page starts with plain HTML and then follows the Week 7 lesson flow. Students can see exactly where the code is written on the left and what changes on the page on the right.

Current Lesson Step

Step Navigation

Code Window

You can edit the code here and click Apply without moving to the next step.

0 lines visible

Edit the current step code, then click Apply to update the preview instantly.

Live Preview

The preview updates instantly with the active code.

Step 1