Funkcia brightness
Funkcia brightness umožňuje zmeniť
jas obrázka na pozadí. Pôvodný jas
pozadia je určený hodnotou 100% alebo 1,
pri ich znížení sa zníži aj jas obrázka.
Naopak pri zvýšení hodnoty nad 100%
jas stúpa. Záporné hodnoty sa nepoužívajú,
a prázdna hodnota je automaticky vnímaná
ako 1.
Syntax
selektor {
filter: brightness(číslo);
}
Príklad
Nastavme nášmu obrázku jas
na 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;
}
:
Príklad
A teraz zvýšme jas obrázka
na 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;
}
:
Príklad
Nastavme nášmu obrázku pôvodný jas:
<div id="elem"></div>
#elem {
filter: brightness(1);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Pozri tiež
-
funkcia
blur,
ktorá rozostrí pozadie -
funkcia
contrast,
ktorá nastavuje kontrast pozadia -
funkcia
drop-shadow,
ktorá nastavuje tieň pozadiu -
funkcia
hue-rotate,
ktorá nastavuje farebnosť pozadia -
funkcia
invert,
ktorá invertuje farby pozadia -
funkcia
opacity,
ktorá nastavuje priehľadnosť pozadia -
funkcia
sepia,
ktorá prevedie pozadie na sépiu -
vlastnosť
background,
ktorá predstavuje skrátenú vlastnosť pre pozadie -
vlastnosť
background-image,
pomocou ktorej možno bloku nastaviť obrázok na pozadí -
vlastnosť
filter,
ktorá nastavuje štýl pre pozadie