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қасиеті,
ол фон үшін стиль береді