Функция brightness
brightness функциясы фондун сүрөтүнүн
жарыктуулугун өзгөртүүгө мүмкүндүк берет. Фондун баштапкы жарыктуулугу
100% же 1 маанилери менен аныкталат,
аларды азайтуу менен сүрөттүн жарыктуулугу да төмөндөйт.
Ошону менен бирге, маанини 100%ден жогору көтөргөндө
жарыктуулук жогорулайт. Терс маанилер колдонулбайт,
бош маани автоматтык түрдө
1 катары кабыл алынат.
Синтаксис
селектор {
filter: brightness(сан);
}
Мисал
Келгиле, сүрөтүбүзгө жарыктуулукту
20% кылып коёлу:
<div id="elem"></div>
#elem {
filter: brightness(20%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Мисал
Эми болсо, келгиле сүрөттүн жарыктуулугун
120%ге чейин көтөрөлү:
<div id="elem"></div>
#elem {
filter: brightness(120%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Мисал
Келгиле, сүрөтүбүзгө баштапкы жарыктуулукту коёлу:
<div id="elem"></div>
#elem {
filter: brightness(1);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Ошондой эле караңыз
-
blurфункциясы,
ал фонду чаңкылдатат -
contrastфункциясы,
ал фонго контрасттуулукту берет -
drop-shadowфункциясы,
ал фонго көлөкө берет -
hue-rotateфункциясы,
ал фонго түс берүүчүлүк берет -
invertфункциясы,
ал фондун түстөрүн инверсиялайт -
opacityфункциясы,
ал фонго өтө ачыктык берет -
sepiaфункциясы,
ал фонду сепияга айландырат -
backgroundкасиети,
ал фон үчүн кыскартылган касиет болуп саналат -
background-imageкасиети,
анын жардамы менен блокко фондук сүрөттү коюуга болот -
filterкасиети,
ал фон үчүн стилди берет