brightness ֆունկցիան

brightness ֆունկցիան թույլ է տալիս փոխել ֆոնային պատկերի պայծառությունը: Ֆոնի սկզբնական պայծառությունը որոշվում է 100% կամ 1 արժեքով, դրանք նվազեցնելիս նվազում է նաև պատկերի պայծառությունը: Ըստ այդմ, երբ արժեքը գերազանցում է 100%-ը, պայծառությունը մեծանում է: Բացասական արժեքներ չեն կիրառվում, իսկ դատարկ արժեքը ավտոմատ կերպով ընկալվում է որպես 1:

Շարահյուսություն

cssընտրիչ {
  filter: brightness(թիվ);
}

Օրինակ

Եկեք մեր պատկերի համար սահմանենք 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;
}

Результат:

Օրինակ

Իսկ այժմ եկեք պատկերի պայծառությունը մեծացնենք մինչև 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;
}

Результат:

Օրինակ

Եկեք մեր պատկերի համար սահմանենք սկզբնական պայծառություն:

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;
}

Результат:

Տես նաև