sepia လုပ်ဆောင်ချက်

sepia လုပ်ဆောင်ချက်သည် နောက်ခံပုံရိပ်ကို sepia - ညိုဝါရောင်အရောင် ဆောင်းထားသော အနက်နှင့်အဖြူပုံရိပ် အဖြစ်သို့ ပြောင်းလဲပေးသည်။ 0 တန်ဖိုးသည် ပုံရိပ်သည် မူလအတိုင်းကျန်ရှိမည်ကို ဖော်ညွှန်းသည်။ 100% သို့မဟုတ် 1 တန်ဖိုးသည် နောက်ခံကို အပြည့်အဝ sepia အဖြစ်သို့ ပြောင်းလဲပေးသည်။ ဤအတိုင်းအတာအတွင်းရှိ မည်သည့်နံပါတ်မဆို sepia ကို အလျှောက်လိုက်အသုံးပြုမှုကို သတ်မှတ်ပေးသည်။ အနုတ်တန်ဖိုးကို သတ်မှတ်၍မရပါ။ စံထားရာတန်ဖိုးသည် 0 ဖြစ်သည်။

ဝါကျဖွဲ့စည်းပုံ

selector {
	filter: sepia(number);
}

ဥပမာ

ကျွန်ုပ်တို့၏ပုံရိပ်ကို အပြည့်အဝ sepia အဖြစ်ပြောင်းလဲလိုက်ကြပါစို့:

<div id="elem"></div>

#elem {
	filter: sepia(100%);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

ဥပမာ

ယခုတစ်ခါ sepia သတ်မှတ်ခြင်းကို 50% အထိလျှော့ချလိုက်ကြပါစို့:

<div id="elem"></div>

#elem {
	filter: sepia(50%);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

ဥပမာ

ယခုတစ်ခါ sepia လုပ်ဆောင်ချက်တွင် 0 နှင့်ညီသောတန်ဖိုးကို သတ်မှတ်လိုက်ကြပါစို့:

<div id="elem"></div>

#elem {
	filter: sepia(0);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

ဤအကြောင်းကိုလည်းကြည့်ပါ

blur လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံကိုမှုန်ဝါးစေသည်
brightness လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံ၏တောက်ပမှုကိုသတ်မှတ်ပေးသည်
contrast လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံ၏ခြားနားထင်ရှားမှုကိုသတ်မှတ်ပေးသည်
drop-shadow လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံအားအရိပ်ထိုးပေးသည်
hue-rotate လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံ၏အရောင်သွင်ပြင်ကိုသတ်မှတ်ပေးသည်
invert လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံအရောင်များကိုပြောင်းပြန်လှန်ပေးသည်
opacity လုပ်ဆောင်ချက်,
အရာသည်နောက်ခံ၏ဖောက်ထွင်းမြင်နိုင်မှုကိုသတ်မှတ်ပေးသည်
background ဂုဏ်သတ္တိ,
အရာသည် နောက်ခံအတွက်အတိုကောက်ဂုဏ်သတ္တိဖြစ်သည်
background-image ဂုဏ်သတ္တိ,
အရာဖြင့် block တစ်ခုအားနောက်ခံပုံရိပ်သတ်မှတ်ပေးနိုင်သည်
filter ဂုဏ်သတ္တိ,
အရာသည်နောက်ခံအတွက်စတိုင်သတ်မှတ်ပေးသည်