CSS Koppelen aan HTML
Veeg om het menu te tonen
Hoe CSS aan HTML wordt toegevoegd
Er zijn drie manieren om CSS toe te passen op een HTML-document:
- Inline stijlen;
- Ingesloten stijlsheets;
- Externe stijlsheets.
Elke methode werkt anders en wordt in verschillende situaties gebruikt.
Inline stijlen
Inline stijlen worden direct binnen een HTML-element geschreven met het attribuut style.
Voorbeeld:
index.html
Deze stijl is alleen van toepassing op dit specifieke element.
Inline stijlen zijn snel te gebruiken, maar ze zijn niet herbruikbaar en lastig te beheren in grotere projecten.
Ingebedde Stijlblad
Een ingebed stijlblad wordt geschreven binnen <style>-tags in de <head>-sectie van een HTML-document.
Voorbeeld:
index.html
Deze methode past stijlen toe op de gehele pagina, maar alleen binnen dit enkele HTML-bestand.
Handig voor kleine of op zichzelf staande pagina's.
Extern stijlblad
Externe CSS slaat stijlen op in een apart .css-bestand en koppelt dit aan HTML met behulp van de <link>-tag.
Voorbeeld:
index.html
styles.css
Met deze methode kunnen stijlen worden hergebruikt op meerdere pagina's.
Dit is de aanbevolen en meest schaalbare aanpak voor echte projecten.
Inline stijlen: direct toegepast op elementen, maar niet herbruikbaar.
Ingesloten stijlblad: toegepast binnen de <head>, heeft alleen invloed op één pagina.
Extern stijlblad: opgeslagen in een apart .css-bestand, herbruikbaar en aanbevolen voor de meeste projecten.
In deze cursus gebruiken we voornamelijk externe stijlbladen.
Bedankt voor je feedback!
Vraag AI
Vraag AI
Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.