Kazi ya blur
Kazi blur inaruhusu kuchosha
picha za asili kwa kutumia Gaussian blur.
Syntax
kichaguzi {
filter: blur(ukubwa wa kuchosha);
}
Mfano
Wacha tuweke kuchosha kwa picha yetu
kwa 2px:
<div id="elem"></div>
#elem {
filter: blur(2px);
background-blend-mode: normal;
background: url("bg.png") center / cover no-repeat,
linear-gradient(#00A8DE, #FFF) fixed;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Angalia pia
-
kazi
brightness,
ambayo huweka mwangaza wa asili -
kazi
contrast,
ambayo huweka utofauti wa asili -
kazi
drop-shadow,
ambayo huweka kivuli cha asili -
kazi
hue-rotate,
ambayo huweka rangi ya asili -
kazi
invert,
ambayo hubadilisha rangi za asili -
kazi
opacity,
ambayo huweka uwazi wa asili -
kazi
sepia,
ambayo hubadilisha asili kuwa sepia -
sifa
background,
inayowakilisha sifa iliyofupishwa kwa asili -
sifa
background-image,
ambayo kwa kutumia block inaweza kupewa picha ya asili -
sifa
filter,
ambayo huweka mtindo wa asili