CSS & Styling
Wat is Cascade, Specificity en Inheritance in CSS?
Deze drie principes bepalen welke CSS-regels worden toegepast op elementen.
Cascade (watervalling)
CSS staat voor Cascading Style Sheets. 'Cascade' betekent dat CSS-regels van boven naar beneden worden gelezen. De laatste regel wint wanneer twee regels met gelijke specificiteit conflicteren.
Specificity (specificiteit)
Specificity bepaalt welke selector prioriteit heeft: Tag selectors (1 punt): div, p Class/attribute selectors (10 punten): .button, [type] ID selectors (100 punten): #main Inline styles (1000 punten): style= !important (10000 punten) - vermijd dit Hoe hoger de specificity, hoe sterker de regel.
Inheritance
Sommige CSS-eigenschappen erven over van parent naar child elementen. Font-family, color, line-height erven over. Width, padding, margin erven NIET over.
Code Voorbeelden
💡 Praktijk Tips
Houd specificity laag door meer generieke selectors te gebruiken. Vermijd ID selectors waar mogelijk. !important is een code smell - teken dat iets niet klopt.