Fungsi CSS saturate()

Definisi dan penggunaan

CSS saturate() Fungsi filter digunakan untuk mengatur kelembaban elemen (kekuatan warna).

  • 0% (atau 0) akan membuat elemen sepenuhnya dihilangkan kelembaban
  • 100% (atau 1) akan tanpa efek
  • 200% (atau 2) akan membuat elemen kelembaban yang ekstra

Contoh

Contoh 1

Atur kelembaban yang berbeda bagi gambar：

#img1 {
  filter: saturate(0);
}
#img2 {
  filter: saturate(100%);
}
#img3 {
  filter: saturate(200%);
}

Coba sendiri

Contoh 2

untuk saturate() dengan backdrop-filter Gunakan kombinasi atribut：

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: saturate(450%);
  backdrop-filter: saturate(450%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

Coba sendiri

Syntaks CSS

saturate(amount)
Nilai Deskripsi
amount

Pilihan. Tentukan nilai kelembaban, dapat berupa angka atau persen.

0% (atau 0) akan membuat elemen sepenuhnya dihilangkan kelembaban.

100% (atau 1) menunjukkan tanpa efek.

Nilai lebih dari 100% akan memberikan efek kelembaban yang ekstra.

Detil teknis

Versi： Modul Efect Filter CSS Level 1

Dukungan browser

Angka di tabel menunjukkan versi browser yang pertama yang mendukung fungsi ini penuh.

Chrome Edge Firefox Safari Opera
18 12 35 6 15

Halaman yang berhubungan

Referensi：Atribut filter CSS

Referensi：Fungsi CSS blur()

Referensi：Fungsi CSS brightness()

Referensi：Fungsi CSS contrast()

Referensi：Fungsi CSS drop-shadow()

Referensi：Fungsi CSS grayscale()

Referensi：Fungsi CSS hue-rotate()

Referensi：Fungsi CSS invert()

Referensi：Fungsi opacity() CSS

Referensi：Fungsi sepia() CSS