Како променити боју слике у ЦСС-у

Ево резултата овог чланка:

• филтер Проперти
• дроп-схадов()
• непрозирност()

Почнимо!

Промените боју слике у ЦСС-у

Да бисте променили боју слике у ЦСС-у, прво научите о својству филтера и његовим функцијама. На овај начин ћете стећи боље разумевање.

филтер својство ЦСС-а

За контролу визуелног ефекта користи се ЦСС својство филтера слика. Визуелни ефекти су:

• замућење
• осветљеност
• подешавање боје
• дроп-схадов
• непрозирност

Синтакса својства филтера

Синтакса својства филтера је:

• замућење(): користи се за примену ефекта замућења на слици.
• дроп-схадов(): створити сенку преко слике.
• непрозирност(): користи се за додавање транспарентности слици.

Можемо користити више филтера користећи ово својство филтера. Овај чланак говори о томе како да промените боју слике, па ћемо овде објаснити како да користите функције дроп-схадов() и опацити().

дроп-схадов()

дроп-схадов() је уграђена функција ЦСС-а која омогућава постављање сенке на било који елемент или слику. Следећи параметри се користе у функцији дроп-схадов() за промену боје слике:

• оффсет-к: Користи се за додавање хоризонталне сенке.
• оффсет-и: Овим се сенке додају вертикално.
• боја: Сенке су обојене овим параметром.

Да бисмо разјаснили ове тачке, пређимо на синтаксу падајуће сенке:

• оффсет-к и оффсет-и могу бити позитивни или негативни.
• У хоризонталном, позитивна вредност се користи за додавање ефеката на десној страни, а негативна за леву страну.
• У вертикали, позитивна вредност је за доњу страну, а негативна за горњу.
• Уместо боје, можете доделити било коју боју коју желите да дате слици.

непрозирност()

опацити() се користи за додавање транспарентности елементу или било којој слици. Синтакса опацити() је:

Ево “ број ” и с се користи за постављање нивоа непрозирности између 0,0 и 1,0. Да бисте слику учинили потпуно транспарентном, можете је поставити на 0.0.

Да бисмо разјаснили горе поменуте тачке, пређимо на пример.

Како променити боју слике у ЦСС-у?

У следећем примеру, прво ћемо додати слику помоћу ознаке <имг>:

Пре примене својства филтера, резултат је био следећи:

Да променимо боју слике, пређимо на ЦСС и применимо својство филтера на њега. Поставићемо непрозирност на 0,5 за транспарентност слике. У функцији дроп-схадов(), вредност офсет-к и оффсет-и је 0 јер желимо само да променимо боју слике.

Ево коначног резултата након имплементације:

Боја слике је успешно промењена.

Закључак

Да бисте променили боју слике, две ЦСС функције: опацити() и дроп-схадов() се користе са својством филтера. опацити() специфицира транспарентност слике, а дроп-схадов() додељује боју и сенку слици. Овај запис је објаснио метод промене боје слике помоћу ЦСС-а.