Backdrop Saturate
Laraskan ketepuan latar belakang
Sintaks
visual="backdrop-saturate:[value]"Nilai
| Nilai | CSS Output | Huraian |
|---|---|---|
none | backdrop-filter: saturate(0) | Tidak tepu |
low | backdrop-filter: saturate(0.5) | Ketepuan rendah |
normal | backdrop-filter: saturate(1) | Ketepuan normal |
high | backdrop-filter: saturate(1.5) | Ketepuan tinggi |
vivid | backdrop-filter: saturate(2) | Sangat tepu |
Contoh
html
<div visual="backdrop-saturate:vivid">Vivid backdrop</div>Pratonton
Ketepuan Latar Belakang
visual="backdrop-saturate:vivid" - Laraskan ketepuan di belakang elemen
none
normal
vivid
Lihat Kod
html
<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
<div space="p:small" visual="bg:primary text:white rounded:small">none</div>
<div space="p:small" visual="bg:primary text:white rounded:small">normal</div>
<div space="p:small" visual="bg:primary text:white rounded:small">vivid</div>
</div>Nilai Arbitrari
Sokong nilai tersuai menggunakan sintaks kurungan segi empat:
html
<div visual="backdrop:[custom-value]">Custom</div>