Lektion 3 - Forberedelse

CSS via freeCodeCamp (ca. 1 time)

Inden lektionen skal du videre i freeCodeCamps Responsive Web Design. Du springer resten af HTML-kapitlet over (bl.a. Recipe Page, Semantic HTML og Forms) og går til CSS.

Responsive Web Design

1. HTML Fundamentals (~10 min)

Kapitlet HTML → modulet Basic HTML → lecturen HTML Fundamentals.

Lav de tre første — ikke den om <script> (den hører til JavaScript senere):

  1. What Are Div Elements and When Should You Use Them?
  2. What Are IDs and Classes, and When Should You Use Them?
  3. What Are HTML Entities, and What Are Some Common Examples?

Hvis Recipe Page ligger foran: spring den over.

2. What is CSS — tre lectures (~10 min)

Kapitlet CSS → modulet Basic CSS → lecturen What is CSS.

Kun disse tre (spring de øvrige over — Cafe Menu dækker dem):

  1. What Is CSS, and What Is Its Role on the Web?
  2. What Is the Basic Anatomy of a CSS Rule?
  3. What Are Inline, Internal, and External CSS, and When Should You Use Each One?

3. Cafe Menu til trin 28 (~40 min)

Samme modul → workshoppen Cafe Menu.

Øvelsen er i hus ved trin 28 (eksternt stylesheet, type- og class-selectors, width, margin: auto). Så kan du style jeres egen side.

Hvis du har tid: fortsæt til trin 55 (padding).

Resten af Cafe Menu og resten af Basic CSS-modulet laver vi ikke.

Bemærk: freeCodeCamp kræver login (gratis) for at gemme din fremgang.

Praktisk

  • Medbring din bærbare computer med VS Code. Vi arbejder videre med det du lavede i Lektion 1 (index.html og login.html).
  • Du behøver ikke kunne CSS på forhånd — forberedelsen ovenfor er nok.