CSS Feature Queries, ki jih uporabimo s pomočjo značke @supports nam omogoča, da del CSS-ja zapremo v pogojni blok. V praksi to pomeni, da se določen del CSS-ja izpiše le v primeru, če brskalnik oz. njegov »user agent« podpira določeno CSS značko.
Zelo futuristična značka, ki smo jo že dlje časa čakali v CSS-ju je @supports. Slednja nam omogoča pogojevanje določenih stilov v samem CSS-ju. Poleg osnovnega pogoja lahko uporabimo tudi operaterje, kot so »and« in »not«. Uporaba CSS značk, kot je flexbox in grid bo sedaj precej lažja.
Primer za Flexbox
@supports ( display: flex ) {
.foo { display: flex; }
}Naprednejša oblika, ki preveri, če brskalnik uporablja samo starejšo verzijo Flexbox-a
@supports ( display: flexbox ) and ( not ( display: flex ) ) {
.foo { display: flexbox; }
}Ali lahko Feature Queries – @supports že uporabimo?
Feature Queries ima danes že zelo široko podporo, težave imamo lahko le pri brskalniku IE, kjer je potrebno zagotoviti ustrezno alternativo.