Wat is CSS if() Functiebouwer?
De CSS if() functie laat u voorwaardelijke waarden schrijven direct in een eigenschapsdeclaratie. In plaats van een waarde in @media, @container of @supports te plaatsen, gebruikt u if() inline. Het ondersteunt style() voor CSS-eigenschappen, media() voor mediafuncties en supports() voor feature-detectie. Chrome 137+ ondersteunt if(style()).
Snel antwoord
De CSS if() functie laat u voorwaardelijke waarden inline schrijven. Gebruik if(style()) voor CSS-eigenschappen, if(media()) voor mediafuncties en if(supports()) voor browserondersteuning. Chrome 137+ ondersteunt if(style()).
Last updated: 2026-05-30
Beperkingen
- Alleen Chrome 137+ (style()) en Chrome 142+ (media(), supports()).
- Evalueert een enkele conditie voor een enkele waarde.
- if(style()) werkt alleen op expliciet ingestelde of geregistreerde variabelen.
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
Zo gebruik je deze tool
- Kies het conditietype: style(), media() of supports().
- Voer de conditie-expressie en de waarde bij waar in.
- Optioneel een else-waarde voor als de conditie onwaar is.
- Kopieer de if()-declaratie in uw CSS.
Waarvoor je het kunt gebruiken
- Stel een breedte in op basis van een CSS-variabele zonder @container.
- Pas een kleurenschema aan op basis van prefers-color-scheme.
- Geef een terugvalwaarde bij ontbrekende browserfeature.