CSS & Styling
Wat zijn media queries en hoe maak je responsive design?
Media queries passen CSS toe op basis van device karakteristieken.
Media query syntax
@media (condition) { CSS hier } Bijvvoorkeur condities: max-width, min-width, orientation, color-scheme
Mobile-first approach
Begin met styling voor mobiele devices. Gebruik media queries om GROTER worden te styleren. Dit is efficiënter dan desktop-first.
Code Voorbeelden
CSSResponsive grid met media queries✏️ Interactief
✏️CODE AANPASSEN
LIVE PREVIEW
💡 Praktijk Tips
Mobile-first is standard nu. Common breakpoints: 768px (tablet), 1024px (desktop), 1440px (large).
Relevante trefwoorden
media queryresponsivemobile-firstbreakpoint