Labo 02
Introductie
Start een nieuw project in de IDE naar keuze.
- Zorg voor een index.html en een styles.cc.
- Pas je HTML lang attribuut aan.
- Geef je document de title 'Labo 02'.
Stap 1: HTML
- Vergeet je landmark regions niet!
- Deel je hoofdinhoud (main) op de sections.
- Tip: de links in de navigatie zijn same link page links.
- Valideer je code regelmatig met de W3c-validator en met axe devtools
Stap 2: link-tags
- Voeg normalize.cc toe in de head van je HTML-document.
- Voeg een google font (Monserrat) toe in de head van je HTML-document.
- Koppel je eigen styles.css aan je HTML
Stap 3:start CSS
- 'Corrigeer' de box-sizing property van alle elementen en van alles ::before en ::after pseudo-elementen
- Maak een selector voor het root element → :root { ... }
-
Pas de background-color aan naar #fffdff.
Pas de font-family aan naar Montserrat en vergeet je fallback font niet!
Zet de lin-height op 1.6.
Zet scroll-behavior op smooth.
- Maak een selector voor het element → body { ... }
Container
Een container is een typsich 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