CSS(Cascading Style Sheets) huwa komponent fundamentali tal-iżvilupp tal-web li għandu rwol kruċjali fil-kontroll tad-dehra viżwali tal-elementi HTML fuq il-websajt tiegħek. Jipprovdi sett qawwi ta’ regoli u proprjetajiet li jiddefinixxu kif l-elementi jintwerew, ifformattjati u pożizzjonati, li jippermettulek tippersonalizza d-dehra u s-sensazzjoni tal-paġni web tiegħek.
Nibdew billi nifhmu l-kunċett ta 'seletturi
Seletturi huma użati biex jimmiraw elementi HTML speċifiċi għall-grafika. Wieħed mill-aktar seletturi bażiċi huwa s-selettur tal-element, li jagħżel l-istanzi kollha ta 'element HTML partikolari.
Pereżempju, ir-regola CSS li ġejja timmira l-paragrafi kollha f'dokument:
p {
color: blue;
}
F'dan l-eżempju, is- p
selettur jagħżel <p>
l-elementi kollha u jistabbilixxi l-kulur tat-test tagħhom għal blu.
Selettur komuni ieħor huwa s-selettur tal-klassi
Il-klassijiet jintużaw biex jiġbru l-elementi b'karatteristiċi simili. Billi tassenja klassi lil elementi HTML, tista 'timmirahom u tistiljahom kollettivament.
Hawn eżempju:
.blue-text {
color: blue;
}
f'dan il-każ, is- .blue-text
selettur jimmira l-elementi kollha bil-klassi blue-text
u japplika l-kulur blu għat-test tagħhom.
Barra minn hekk, is ID
-selettur jippermettilek li timmira element speċifiku mill-identifikatur uniku tiegħu. ID
huma tipikament assenjati għal elementi individwali fuq paġna.
Hawn eżempju:
#header {
background-color: gray;
}
F'dan l-eżempju, is #header
-selettur jagħżel l-element bil- ID header
u japplika kulur griż fl-isfond għalih.
Ngħaddu għas-sintassi tas-CSS, kull regola CSS tikkonsisti f'selettur u blokka ta' dikjarazzjoni
Il-blokka tad-dikjarazzjoni hija magħluqa f'ċingi kaboċċi {}
u fiha dikjarazzjoni waħda jew aktar. Id-dikjarazzjonijiet jikkonsistu fi proprjetà u l-valur korrispondenti tagħha.
Hawn eżempju:
h1 {
font-size: 24px;
color: #333;
}
F'dan is-snippet tal-kodiċi, is- h1
selettur jagħżel l-elementi kollha <h1>
u jistabbilixxi d-daqs tat-tipa tagħhom għal 24 pixel u l-kulur tat-test għal griż skur(#333).
Matul din is-serje, se nesploraw u nispjegaw diversi proprjetajiet CSS, seletturi, u l-kombinazzjonijiet tagħhom, li jippermettulek toħloq websajts viżwalment attraenti u strutturati tajjeb. Il-fehim tas-CSS u s-sintassi bażika tiegħu jagħtik il-pedament biex tieħu l-kontroll tal-aspetti tal-grafika tal-paġni web tiegħek, u tiżgura esperjenza tal-utent unika u personalizzata. Ejja ngħaddu u niskopru l-possibilitajiet illimitati tas-CSS!