Команди 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;
  }
}

Результат:

Инчунин бубинед

  • команди @import,
    ки файли CSS-ро ворид мекунад
  • команди @media,
    ки услуги барои навъи воситаро муайян мекунад
  • команди !important,
    ки афзалиятнокии услугиро муайян мекунад