De voorpagina van nos.nl is voor het Handboek HTML5 en CSS nagebouwd met CSS Grid Layout. De uitleg is te vinden in het Handboek, hier vind je de code.
De code is op twee manieren te gebruiken:
Kopiëren is goed te doen als het maar een paar bestanden zijn, zoals in deze repository. Als het er meer zijn, kun je beter een GitHub-account maken en leren hoe je projecten beheert met Git en GitHub.
Dit is de makkelijkste optie als je nog nooit met GitHub hebt gewerkt.
- Hierboven zie je de bestandenlijst van deze repository (repo). Klik op index.html.
- Nu zie je de inhoud van dat bestand. Klik rechts direct boven de code op de knop Raw.
-
De kale code wordt geopend in het browservenster. Klik in dit venster, druk op Ctrl+A (Command+A) om alle code te selecteren en druk op Ctrl+C (Command+C) om de selectie te kopiëren.
-
Maak op je eigen computer in je projectmap een nieuw bestand index.html en plak daar de code in.
-
Herhaal de stappen 1, 2 en 3 voor het bestand nos_style.css in de map css.
-
Maak in je projectmap een map met de naam css en maak daarin een bestand met de naam nos_style.css. Plak daar de CSS-code in.
Je hebt nu een lokale kopie van de complete pagina op je eigen computer.
Door de repo te klonen maak je een exacte kopie op je eigen computer. Je hebt dan wel een GitHub-account nodig. Je kunt klonen via https, via SSH en met GitHub-CLI. Kijk voor uitleg op bijbehorende helppagina's.