Функцыя drop-shadow

Функцыя drop-shadow дазваляе дадаць цень да фонавага відарыса.

Сінтаксіс

селектар {
	filter: drop-shadow(зрух па x, зрух па y, радыўс размыцця, колер);
}

Значэнні

Значэнне	Апісанне
зрух па x	Зрушэнне ценю па гарызанталі адносна фону. Дадатны лік абазначае зрушэнне ценю направа, адмоўны - налева. Абавязковы параметр.
зрух па y	Зрушэнне ценю па вертыкалі адносна фону. Дадатны лік абазначае зрушэнне ценю ўніз, адмоўны - уверх. Абавязковы параметр.
размыццё	Устанаўлівае радыўс размыцця ценю. Чым большае значэнне, тым большы цень размываецца. Апцыянальны параметр. Па змаўчанні роўны `0`.
колер	Колер ценю. Апцыянальны параметр. Па змаўчанні ўстанаўліваецца чорны колер ценю.

Прыклад

Давайце ўстановім для нашага відарыса блакітны цень без зрушэння па восях, з размыццём 5px:

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

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

Глядзіце таксама

функцыя blur,
якая размывае фон
функцыя brightness,
якая задае яркасць фону
функцыя contrast,
якая задае кантрастнасць фону
функцыя hue-rotate,
якая задае афарбоўку фону
функцыя invert,
якая інвертуе колеры фону
функцыя opacity,
якая задае празрыстасць фону
функцыя sepia,
якая пераўтварае фон у сепію
уласцівасць background,
якая ўяўляе сабой уласцівасць-скарачэнне для фону
уласцівасць background-image,
з дапамогай якога блоку можна задаць фонавую карцінку