De @supports regel
De regel @supports definieert stijl voor elementen op basis van
door de browser ondersteunde mogelijkheden.
Binnen deze regel kunnen voorwaarden worden gecreëerd met behulp van
logische operatoren not,
and, en or.
Syntaxis
@supports voorwaarde {
}
Voorbeeld
Laten we een voorwaarde instellen dat als uw browser de
eigenschap display met de waarde flex ondersteunt,
alleen de alinea met de bijbehorende tekst wordt weergegeven,
terwijl de kleur van het lettertype
lichtblauw is:
<p class="yes">Uw browser ondersteunt display: flex.</p>
<p class="no">Uw browser ondersteunt display: flex niet.</p>
@supports (display: flex) {
.no {
display: none;
}
p {
color: #467CBC;
}
}
@supports not (display: flex) {
.yes {
display: none;
}
}
:
Zie ook
-
de regel
@import,
die een CSS-bestand importeert -
de regel
@media,
die stijl definieert voor een mediatype -
de regel
!important,
die prioriteit aan stijl geeft