Wat zijn ingebouwde stijlen en wat is hun prioriteit?
sobes.tech AI
Antwoord van AI
Inline-stijlen zijn stijlen die direct in het HTML-element worden gedefinieerd met behulp van het style-attribuut.
<p style="color: red;"> Deze tekst wordt rood </p>
De prioriteit van inline-stijlen is de hoogste onder alle methoden om stijlen in CSS toe te passen. Ze overschrijven stijlen uit externe stylesheets (.css), stijlen uit <style>-blokken in <head> en geërfde stijlen van ouderlijke elementen. Een uitzondering vormen regels met de vlag !important.
Voorbeeld van prioriteiten (van hoog naar laag, bij gelijke specificiteit):
- Regels met
!important(niet aanbevolen). - Inline-stijlen (
style-attribuut). - Externe stylesheets (
<link rel="stylesheet">). - Interne stijlen (
<style>-blok in<head>). - Geërfde stijlen.
- Standaardbrowserstijlen.
Inline-stijlen hebben een specificiteit die gelijk is aan een ID-selector (#id).
Het belangrijkste nadeel van inline-stijlen is de lage onderhoudbaarheid. Ze bemoeilijken het centraal beheren van stijlen, maken refactoring moeilijk en leiden tot duplicatie van code. Daarom wordt aanbevolen om het gebruik ervan te beperken, bijvoorbeeld voor tijdelijke debug-stijlen of in componenten waar stijlen dynamisch worden berekend en gekoppeld aan een specifiek element.