Een stylesheet voor een responsive site

Hieronder zie je het ‘skelet’ van het stylesheet dat we in het boek gebruiken om onze site responsive te maken. Kopieer het, zodat je mee kunt tikken met het voorbeeld. Je kunt ook andere kleuren voor de verschillende onderdelen van je pagina kiezen als je dat wil. Zorg er wel voor dat ze allemaal verschillend zijn, zodat je de verschillende onderdelen van de pagina goed van elkaar kunt onderscheiden.

/* technisch gedeelte – past de grootte van het kader aan */
html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

/* geeft structuurelementen hun uiterlijk */
html {
    background-color: black;
}

body {
    background-color: ghostwhite;
}

header {
    background-color: crimson;
}

nav {
    background-color: darkorange;
}

article {
    background-color: gold;
}

section {
    background-color: lawngreen;
}

aside {
    background-color: royalblue;
}

footer {
    background-color: darkorchid;
}