CSS saturate() ပုံစံ

အသုံးပြုနည်း နှင့် ဖော်ပြ

CSS အတွက် saturate() အပေါ်ပေါ် ကို အခုဒိန်းထွက်ပေါ် အသုံးပြု ပုံစံ ကို ပြင်ဆင်ပါ

  • 0%（သို့မဟုတ် 0）သည် အကွဲသုံး အခုဒိန်းထွက်ပေါ် သုံးသည်
  • 100%（သို့မဟုတ် 1）သည် အကျိုးဆက် မရှိ
  • 200%（သို့မဟုတ် 2）သည် အကွဲသုံး အခုဒိန်းထွက်ပေါ်

အမှတ်

အမှတ် 1

ယုံကြည်သော အခုဒိန်းထွက်ပေါ် ကို အသုံးပြုပါ

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

ကိုယ်တိုင် ကျယ်ပါ

အမှတ် 2 ကို

အသုံးပြု ပြီး saturate() နှင့် backdrop-filter အချက်အလက် ပေါင်းစပ် အသုံးပြု:

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;
}

ကိုယ်တိုင် ကျယ်ပါ

CSS ပုံစံ

saturate(amount)
အတွက် သုံးသပ်
amount

အသုံးပြုခြင်း အတွက် တိကျသော အခုဒိန်းထွက်ပေါ် အတွက် အသုံးပြု အတွက် စားသုံး သည် ဖြစ် ပါသည် သို့မဟုတ် တိကျသော အခုဒိန်းထွက်ပေါ် ဖြစ်

0%（သို့မဟုတ် 0）သည် အကွဲသုံး ကို အခုဒိန်းထွက်ပေါ် သုံးသည်

100%（သို့မဟုတ် 1）သည် အကျိုးဆက် မရှိ

100% အထက် အတွက် အခုဒိန်းထွက်ပေါ် အကျိုးဆက်သည်

နည်းပါး အချက်အလက်

ပုံစံ: CSS Filter Effects Module Level 1

ဘက်တီးရီးယား ကူညီ

အချက်အလက် စာရင်းအရ ဖော်ပြထားသော နေရာတွင် ဖြစ်သော ဘက်တီးရီးယား ပုံစံ ကို အသုံးပြုခြင်း သည် အပြည့်အဝင် ကူညီပေးသည်

ချိုး အက်ဂျက် ဘေ့စ်ဖူ ဆိုဖြူ အိုပရက်
18 12 35 6 15

ဆိုခဲ့တာ စာမျက်နှာ

ကိုးကားစီစ်အုပ်စု ကွဲဖြိုးသုံး filter

ကိုးကားCSS blur() ပုံစံ

ကိုးကားCSS brightness() ပုံစံ

ကိုးကားCSS contrast() ပုံစံ

ကိုးကားCSS drop-shadow() ပုံစံ

ကိုးကားCSS grayscale() ပုံစံ

ကိုးကားCSS hue-rotate() ပုံစံ

ကိုးကားCSS invert() ပုံစံ

ကိုးကားCSS opacity() လှည့်

ကိုးကားCSS sepia() လှည့်