Funktsioon brightness

Funktsioon brightness võimaldab muuta taustapildi heledust. Algne tausta heledus on määratud väärtusega 100% või 1, nende vähendamisel väheneb ka pildi heledus. Vastavalt suurendades väärtust üle 100% heledus suureneb. Negatiivseid väärtusi ei rakendata, ja tühi väärtus võetakse automaatselt kui 1.

Süntaks

cssselektor {
  filter: brightness(arv);
}

Näide

Määrame oma pildile heleduse väärtuseks 20%:

html<div id="elem"></div>

css#elem {
  filter: brightness(20%);
  background: url("bg.png") center / cover no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

Näide

Nüüd suurendame pildi heledust väärtuseni 120%:

html<div id="elem"></div>

css#elem {
  filter: brightness(120%);
  background: url("bg.png") center / cover no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

Näide

Määrame oma pildile algse heleduse:

html<div id="elem"></div>

css#elem {
  filter: brightness(1);
  background: url("bg.png") center / cover no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

Vaata ka