Команда supports

Команда @supports дефинише стил елемената узимајући у обзир могућности које прегледач подржава. У овој команди можете креирати услове користећи логичке операторе not, and, or.

Синтакса

css@supports услов {
  
}

Пример

Поставићемо услов да, ако ваш прегледач подржава својство display са вредношћу flex, да се прикаже само пасус са одговарајућим текстом, при чему ће боја његовог фонта бити плаве боје:

html<p class="yes">Ваш прегледач подржава display: flex.</p>
<p class="no">Ваш прегледач не подржава display: flex.</p>

css@supports (display: flex) {
  .no {
    display: none;
  }
  p {
    color: #467CBC;
  }
}
@supports not (display: flex) {
  .yes {
    display: none;
  }
}

Результат:

Погледајте такође