hue-rotate ශ්රිතය
hue-rotate ශ්රිතය පසුබිම් රූපයේ
වර්ණ සංතෘප්තිය වර්ණ රවුමක සෙවන භ්රමණය කිරීම මගින්
වෙනස් කිරීමට ඉඩ සලසයි. දේපලේ අගයන් අංශක වලින් දක්වනු ලැබේ, එය
වර්ණ රවුමේ කෝණය දක්වයි. 0 හෝ 360 අගය යනු
රූපය නොවෙනස්ව පවතින බව දක්වන අතර, මෙම පරාසය තුළ ඇති ඕනෑම අංකයක්
පසුබිමේ සෙවන වෙනස් කිරීමට හේතු වේ.
පෙරනිමියෙන් අගය වන්නේ 0deg ය.
වාක්ය රීතිය
තෝරන්නා {
filter: hue-rotate(කෝණය);
}
නිදර්ශනය
අපගේ රූපය සඳහා වර්ණ සංතෘප්තිය
150deg ට සමාන කරමු:
<div id="elem"></div>
#elem {
filter: hue-rotate(150deg);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
නිදර්ශනය
දැන් රූපයේ වර්ණ සංතෘප්තිය
50deg ට සමාන කරමු:
<div id="elem"></div>
#elem {
filter: hue-rotate(50deg);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
නිදර්ශනය
hue-rotate දේපලේ අගය
පැවරීමෙන් වැළකී සිටමු:
<div id="elem"></div>
#elem {
filter: hue-rotate();
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
මෙයද බලන්න
-
blurශ්රිතය,
පසුබිම අඳුරු කරන -
brightnessශ්රිතය,
පසුබිමට දීප්තිය පවරන -
contrastශ්රිතය,
පසුබිමට විරුද්ධත්වය පවරන -
drop-shadowශ්රිතය,
පසුබිමට සෙවනැල්ලක් පවරන -
invertශ්රිතය,
පසුබිමේ වර්ණ ආපසු හරවන -
opacityශ්රිතය,
පසුබිමට පාරදෘෂ්යතාව පවරන -
sepiaශ්රිතය,
පසුබිම sepia බවට පරිවර්තනය කරන -
backgroundදේපල,
පසුබිම සඳහා කෙටිකතා දේපලක් වන -
background-imageදේපල,
යොදා ගනිමින් බ්ලොක් එකකට පසුබිම් පින්තූරයක් පවරා ගත හැකි -
filterදේපල,
පසුබිම සඳහා විලාසය පවරන
