One Stylesheet for Both Pages

The HTML of both pages is done. Now for the look. Both pages get it from one stylesheet, style.css, which we've added to the editor, empty for now. As you know from the CSS course, that's the advantage of an external stylesheet: when you change a rule, both pages change at once, and they always look like parts of one website.

For that, each page has to link the stylesheet with the link element in its head:

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

Then comes the rule for body, with what the whole page inherits:

• margin: 0 removes the margin that browsers give body, so that the header and the footer, which will get a background color, reach the edges of the window.
• font-family: Arial, sans-serif: Arial is on almost every computer, and if it's missing, the browser uses another sans-serif font.
• line-height: 1.5 gives the lines a little more room, so that the text is easier to read.
• The text color #1f2937, a very dark gray, which is softer on the eyes than black, and the background color #fdf8f0, a warm cream, like old cinema tickets. If you like, choose your own colors: just keep the text dark on a light background.

After you click Run, try the links in the preview: the showtimes page has the same font and colors as the home page.