Функсияи 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,
ки бо ёрии он ба блок тасвири замина муқаррар кардан мумкин аст