Code

index.html — attach the stylesheet

First, attach the stylesheet. Add one line to index.html's <head>:

<link rel="stylesheet" href="style.css">

href="style.css" is the path to a file next to index.html. We'll create it in a moment; until then the browser asks for style.css, doesn't find it, and simply applies no styles.

The second change is on the <html> element: data-theme="dark".

<html lang="en" data-theme="dark">

It's a plain attribute that says which theme is active. The CSS will respond to it — how, you'll see in the next step when we write the colours. For now just know this: you switch the theme by changing this one attribute, with no JavaScript at all.

The code column has the whole index.html. The body (<h1>, <p>, <a>) hasn't changed since lesson one; only the two lines at the top did. Serve the folder and reload — the page is still unstyled, because style.css doesn't exist yet. We create it next.