Il-Funzjoni tal-Proprjetà CSS box-shadow
Il-proprjetà box-shadow fil-CSS tippermetti li jiżdiedu dellijiet madwar il-frejm ta' element fuq paġna tal-web. Din il-proprjetà tgħin biex jinħoloq sens ta' fond u dimensjoni fl-interface tal-utent, billi tissepara l-elementi viżivi minn xulxin jew mill-isfond. Permezz tal-Ġeneratur ta' Box Shadow, tista' tikkonfigura d-dellijiet b'mod viżwali u tikseb il-kodiċi CSS lest biex jintuża direttament fil-proġetti tiegħek.
Kull dell huwa definit minn diversi parametri li jiddeterminaw il-pożizzjoni tiegħu, l-irtubija, id-daqs, u l-kulur. Il-fehim ta' kif dawn il-valuri jaħdmu flimkien huwa essenzjali biex tfassal dellijiet li jidhru realistiċi u professjonali.
Il-Parametri Ewlenin: Offset, Blur, u Spread
Biex tikkontrolla d-dehra tad-dell, il-ġeneratur jipprovdi sliders speċifiċi għal kull proprjetà:
- Offset orizzontali: Dan is-slider imexxi d-dell lejn il-lemin (valuri pożittivi) jew lejn ix-xellug (valuri negattivi). Il-firxa tiegħu hija minn -50px sa 50px.
- Offset vertikali: Dan is-slider imexxi d-dell 'l isfel (valuri pożittivi) jew 'il fuq (valuri negattivi). Il-firxa tiegħu hija minn -50px sa 50px.
- Sfukar (Blur): Dan jikkontrolla l-irtubija tat-truf tad-dell. Valur ta' 0px ifisser li d-dell ikollu truf li jaqtgħu u solidi, filwaqt li valuri ogħla (sa 100px) ixerrdu d-dell biex jidher aktar artab.
- Firxa (Spread): Dan il-parametru jkabbar jew iċekken id-dell qabel ma jiġi applikat l-isfukar. Il-firxa tiegħu hija minn -50px sa 50px. Valur pożittiv ikabbar id-dell f'kull direzzjoni, filwaqt li valur negattiv jiġbed id-dell 'l ġewwa, u b'hekk jagħmlu iżgħar mill-element oriġinali.
Dellijiet Normali vs. Dellijiet fuq ġewwa (Inset)
B'mod awtomatiku, id-dell jiġi ġġenerat barra l-element, u dan jagħti l-impressjoni li l-element qiegħed f'livell ogħla mill-isfond tiegħu. Din l-għażla hija ideali biex toħloq l-effett ta' "karta mgħollija" (raised card).
Meta tattiva l-għażla Dell fuq ġewwa (Inset), id-dell jinqaleb u jiġi proġettat fuq ġewwa tal-element. Dan l-effett ibiddel il-perċezzjoni viżiva kompletament, u jagħmel l-element jidher ippressat 'l ġewwa jew imdaħħal fl-isfond, bħal f'każ ta' kaxxa tal-input (sunken input) jew buttuna magħfusa.
Il-Ħolqien ta' Fond b'Saffi Multipli
Dell wieħed spiss jidher ċatt jew artifiċjali meta jkun kbir wisq. Fid-dinja reali, id-dawl joħloq dellijiet kumplessi b'livelli differenti ta' intensità u sfukar. Biex tikseb dan l-effett ta' realiżmu, tista' tistakka saffi multipli ta' dellijiet.
Il-ġeneratur jippermettilek iżżid u tneħħi s-saffi b'mod indipendenti. Meta tuża saffi multipli, il-kodiċi CSS iġġenerat jissepara l-valuri ta' kull saff b'komma. Il-ġeneratur jipprepara ħames saffi mill-bidu, fejn l-ewwel saff għandu l-valuri awtomatiċi ta' 0 8 24 -4 b'kulur iswed trasparenti ta' 18%, filwaqt li s-saffi l-oħra jkunu inizjalment moħbija sakemm tikkonfigurahom. Billi tgħaqqad saff dejjaq u skur ma' saff ieħor usa' u aktar ċar, tista' toħloq dellijiet b'fond u dettall eċċezzjonali.
Proċessar Lokali u Privatezza
Kull dell li tiddisinja f'din il-paġna jiġi pproċessat u rrendjat direttament fil-browser tiegħek. L-ebda data dwar il-konfigurazzjoni, il-kuluri jew il-valuri li tagħżel ma tiġi mtella' fuq is-servers ta' BroBroGo. Dan jiżgura li l-proċess kollu tad-disinn jibqa' kompletament privat fuq it-tagħmir tiegħek.
Mistoqsijiet Frekwenti (FAQ)
X'jikkontrollaw eżattament l-offset, il-blur, u l-spread?
L-offset imexxi d-dell fuq ix-xellug/lemin u 'l fuq/'l isfel, il-blur jirtab it-truf tiegħu, u l-spread ikabbar jew iċekken id-dell qabel ma jiġi sfukat. Spread negattiv jiġbed id-dell 'l ġewwa, li huwa utli għal dellijiet dojoq u qrib.
X'tagħmel l-għażla inset?
Dell normali jaqa' barra l-element, bħal dawl wara karta mgħollija. Inset jaqilbu għal ġewwa, u b'hekk l-element jidher ippressat 'l ġewwa — utli ħafna għal inputs jew buttuni magħfusa.
Għaliex għandi nuża aktar minn saff wieħed ta' dell?
Dell wieħed jista' jidher ċatt meta jaqbeż ċertu daqs. Elevazzjoni realistika normalment tgħaqqad dell skur u dejjaq ma' dell ieħor irtub u usa' — żid it-tieni saff u kkonfigura kull wieħed b'mod indipendenti biex tikseb dan l-effett.
Kif nista' nuża l-kodiċi ġġenerat fil-proġett tiegħek?
Wara li taġġusta s-sliders kollha għas-saffi tiegħek, kull ma trid tagħmel huwa li tikkopja l-kodiċi mill-kaxxa tal-output taħt l-intestatura CSS u tpoġġih direttament fir-regola tal-istil tal-element tiegħek fil-fajl CSS tiegħek.