Perintah supports
Perintah @supports mengatur gaya pada elemen dengan mempertimbangkan
fitur yang didukung oleh browser.
Dalam perintah ini, kondisi dapat dibuat menggunakan
operator logika not,
and, or.
Sintaks
@supports kondisi {
}
Contoh
Mari kita buat kondisi bahwa jika browser Anda mendukung
properti display dengan nilai flex,
maka hanya paragraf dengan
teks yang sesuai yang akan ditampilkan, dengan warna font
berwarna biru langit:
<p class="yes">Browser Anda mendukung display: flex.</p>
<p class="no">Browser Anda tidak mendukung display: flex.</p>
@supports (display: flex) {
.no {
display: none;
}
p {
color: #467CBC;
}
}
@supports not (display: flex) {
.yes {
display: none;
}
}
:
Lihat juga
-
perintah
@import,
yang mengimpor file CSS -
perintah
@media,
yang mengatur gaya untuk jenis media -
perintah
!important,
yang mengatur prioritas gaya
