Labo 02

Introductieoefening

Start een nieuw project in je IDE naar keuze.

  1. Zorg voor...
  2. Pas je HTML...
  3. geef je doc...

Stap 1: HTML

  1. Vergeet je...
  2. Deel je hoofdinhoud...
  3. Tip: de links in de navigatie zijn same page link
  4. Valideer je code via de HTML-validator en met de aXe browser devtools.

Stap 2: link-tags

  1. Voeg normalize.css toe...
  2. Voeg een google font Montserrat
  3. Koppel je eigen...

Stap 3: start CSS

  1. 'Corrigeeer' de box-sizing property...
  2. Maak een sector voor het root → :root { ... }
    • pas de backgound-color aan naar #fffdff.
    • Pas de font-family aan...
    • Zet de line-height...
    • Zet scroll-behavior...
  3. Maak een selector voor het body element → body { ... }

Container

Een container is een typisch hulpmiddel om te zorgen dat de inhoud van je site niet uitgesmeerd wordt over je volledige schermbreedte. Je vindt die op héél veel websites terug en is verplicht aanwezig in je portfolio.

Nav

Screenshot van de Nav in HTML.