CSS

CSS (Cascading Style Sheets) is een opmaaktaal voor het vormgeven en stylen van webpagina's en documenten.

CSS staat voor Cascading Style Sheets. Het is een opmaaktaal die bepaalt hoe HTML-elementen worden weergegeven in een browser. CSS scheidt de inhoud (HTML) van de presentatie. Hierdoor kun je kleuren, lettertypen, layouts en animaties toevoegen zonder de HTML-code aan te passen.

CSS werkt met regels die bestaan uit selectors en declaraties. Een selector kiest welke HTML-elementen gestyled worden. De declaraties bepalen de opmaak zoals kleur, grootte en positie. Moderne CSS ondersteunt geavanceerde layoutsystemen zoals Flexbox en Grid. Ook responsive design is mogelijk met media queries.

De kracht van CSS zit in herbruikbaarheid en onderhoud. Eén CSS-bestand kan duizenden webpagina's stylen. Wijzig je de CSS, dan verandert de hele website. Dit maakt webontwikkeling efficiënter en consistenter.

Bij KeurigOnline gebruiken we CSS voor alle websites die we bouwen. We werken met moderne technieken zoals CSS Grid en custom properties. Dit zorgt voor snelle, toegankelijke en responsive websites die er op elk apparaat goed uitzien.

Geschiedenis

CSS werd in 1994 voorgesteld door Håkon Wium Lie terwijl hij werkte met Tim Berners-Lee bij CERN. Bert Bos sloot zich aan als co-auteur. Op 10 oktober 1994 publiceerde Lie zijn eerste voorstel "Cascading HTML Style Sheets".

Voor CSS moest alle opmaak in de HTML-code zelf. Dit maakte websites moeilijk te onderhouden. CSS bood een oplossing door presentatie en inhoud te scheiden.

Belangrijke mijlpalen:

17 december 1996: CSS Level 1 werd de eerste officiële W3C Recommendation
Mei 1998: CSS Level 2 gepubliceerd met ondersteuning voor media types en positionering
7 juni 2011: CSS 2.1 werd W3C Recommendation na jaren testen
Vanaf 1999: CSS Level 3 ontwikkeld als modulaire specificaties in plaats van één groot document

De eerste browser met CSS-ondersteuning was Microsoft Internet Explorer 3 in augustus 1996. Echte bruikbaarheid kwam pas rond 2001 toen browsers beter aan de standaard voldeden.

Bronnen

Online bronnen:

W3C - Cascading Style Sheets home page
MDN Web Docs - CSS: Cascading Style Sheets
W3C (1996) - CSS Level 1 Specification
W3Schools - CSS Tutorial
web.dev - Learn CSS

Boeken:

Meyer, E. & Weyl, E. (2023) - CSS: The Definitive Guide, 5th Edition. O''Reilly Media. ISBN: 978-1098117610
Verou, L. (2015) - CSS Secrets: Better Solutions to Everyday Web Design Problems. O''Reilly Media. ISBN: 978-1449372637
Grant, K.J. (2024) - CSS in Depth, Second Edition. Manning Publications. ISBN: 978-1633437555

Perfecte pairing: Inter Bold voor headings + Inter Regular voor body
Bekijk op Google Fonts: Inter

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 400;
  line-height: 1.6;
}

h1, h2, h3 {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
}

Waarom Inter perfect is voor Nederlands: Nederlandse woorden zijn vaak langer dan Engels, gemiddeld 15% meer karakters. Inter's open apertures en generous spacing zorgen ervoor dat lange samenstellingen leesbaar blijven, zoals "verantwoordelijkheid" of "gezondheidszorg", zelfs op mobile.

Je winkelwagen is leeg

Je winkelwagen is leeg

CSS

Geschiedenis

Bronnen

Gerelateerde artikelen

20 voorbeelden van button designs