Команда 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 командаси,
    стил учун имтиёз белгилайди