drop-shadow funksiyası
drop-shadow funksiyası
fon şəklinə kölgə
əlavə etməyə imkan verir.
Sintaksis
selektor {
filter: drop-shadow(x oxu üzrə sürüşmə, y oxu üzrə sürüşmə, bulanıklıq radiusu, rəng);
}
Dəyərlər
| Dəyər | Təsvir |
|---|---|
| x oxu üzrə sürüşmə | Kölgənin fona nisbətən üfüqi yerdəyişməsi. Müsbət ədəd kölgənin sağa sürüşdüyünü, mənfi isə sola sürüşdüyünü göstərir. Məcburi parametr. |
| y oxu üzrə sürüşmə | Kölgənin fona nisbətən şaquli yerdəyişməsi. Müsbət ədəd kölgənin aşağı sürüşdüyünü, mənfi isə yuxarı sürüşdüyünü göstərir. Məcburi parametr. |
| bulanıklıq |
Kölgənin bulanıklıq radiusunu təyin edir.
Dəyər nə qədər böyük olarsa, kölgə bir o qədər çox bulanır.
İstəyə bağlı parametr. Standart olaraq
0 bərabərdir.
|
| rəng | Kölgənin rəngi. İstəyə bağlı parametr. Standart olaraq qara kölgə rəngi təyin olunur. |
Nümunə
Gəlin şəklimiz üçün oxlar boyunca yerdəyişməsi olmayan, 5px bulanıklığı olan mavi kölgə təyin edək:
<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;
}
:
Həmçinin bax
-
fonu bulanlaşdıran
blurfunksiyası -
fona parlaqlıq təyin edən
brightnessfunksiyası -
fona kontrastlıq təyin edən
contrastfunksiyası -
fona rəng tonu təyin edən
hue-rotatefunksiyası -
fonun rənglərini çevirən
invertfunksiyası -
fona şəffaflıq təyin edən
opacityfunksiyası -
fonu sepıyaya çevirən
sepiafunksiyası -
fon üçün qısaltma xassə olan
backgroundxassəsi -
bloka fon şəkli təyin etmək üçün istifadə olunan
background-imagexassəsi