Basis HTML & CSS: een homepage nabouwen
Download en open het design voor de homepage van het fictieve bedrijf Whitepace: whitepace_home.pdf.
Bouw deze homepage zo goed mogelijk na als HTML-webpagina.
Maak voor deze oefening een nieuwe folder op je computer binnenin de web-1/week-1 folder met de naam whitepace.
De pagina is opgebouwd met verschillende onderdelen: titels, subtitels, paragrafen, sections, navigatie, anchor links.
- Open de folder whitepace met Visual Studio Code.
- Maak een nieuw bestand aan in de folder met de naam index.html.
- Maak een nieuw bestand aan in de folder met de naam style.css.
- Download de nodige assets: assets.zip. Unzip het bestand en plaats de volledige folder (assets), in de folder die je daarnet aanmaakte (whitepace).
- Geef de startstructuur mee in je bestand. Die kan je hier vinden in de slides.
- Pas de tekst tussen het
<title>
-tag in de<head>
-tag aan naar een passende titel voor de webpagina. - Focus eerst op de structuur en content van de pagina. Tussen de
<body>
-openings en sluitingstag start je met de opbouw van je document. - Link de stylesheet in de
<head>
van de document. - In
style.css
schrijf je alle styling. - De tekstuele inhoud van de site mag je copy/pasten .