Kommandot supports
Kommandot @supports anger stil för element med hänsyn till
funktioner som stöds av webbläsaren.
I detta kommando kan du skapa villkor med hjälp av
logiska operatorer not,
and, or.
Syntax
@supports villkor {
}
Exempel
Låt oss sätta ett villkor att om din webbläsare stöder
egenskapen display med värdet flex,
så kommer endast stycket med
motsvarande text att visas, samtidigt som dess teckensnittsfärg
kommer att vara ljusblå:
<p class="yes">Your browser support display: flex.</p>
<p class="no">Your browser does not support display: flex.</p>
@supports (display: flex) {
.no {
display: none;
}
p {
color: #467CBC;
}
}
@supports not (display: flex) {
.yes {
display: none;
}
}
:
Se även
-
kommandot
@import,
som importerar en CSS-fil -
kommandot
@media,
som anger stil för medietyp -
kommandot
!important,
som anger stilprioritet
