Fasallada iyo Aqoonsiga Aqoonsiga Caawintaada CSS
Dhisidda bogagga shabakada internetka waxay u baahan tahay faham qoto dheer CSS (Cascading Style Sheets). Kuwani waa tilmaamaha aad ku siiso website-ka si loo go'aamiyo sida loo qaabeynayo daaqada baraha. Waxaad codsan kartaa taxane ah "qaabab" dukumiintiga HTML kaas oo abuuri doona muuqaalka iyo dareenka boggaaga.
Waxaa jira siyaabo badan oo lagu dabaqi karo noocyada kor ku xusan ee dukumeentiga, laakiin marar badan oo aad rabto inaad isticmaasho qaab ka mid ah qaar ka mid ah qodobada dukumintiga ah, laakiin ma aha dhammaan dhacdooyinkaas.
Waxa kale oo aad rabi kartaa inaad abuurto qaab aad u codsan kartid dhowr waxyaalood oo dukumiinti ah, iyada oo aanad ku celin xeerka qaab-dhaqameedka qof kasta. Si aad u gaarto qaababka la doonayo, waxaad isticmaali doontaa sifooyinka class iyo aqoonsiga HTML. Sifooyinkaasi waa sifooyinka guud ee loo adeegsan karo ku dhowaad dhammaan astaanta HTML .Taas macnaheedu waa in aad adigu leedahay qaybo kala duwan, cutubyo, xiriir, liis ama mid ka mid ah qaybaha kale ee HTML ee dukumeentigaaga, waxaad u jeedin kartaa astaanta fasalka iyo aqoonsiga kaa caawiyaan inaad qabato hawshan!
Xuleyasha Fasalka
Xulashada fasalka waxay kuu ogolaaneysaa inaad qaabab kala duwan u sameyso isla hal ama dokumenti. Tusaale ahaan, waxaa laga yaabaa inaad rabto in aad leedahay qeybo ka mid ah qoraalkaaga oo laguugu yeeray midab kala duwan qoraalka intiisa kale. Qaybahaas la tilmaamay waxay noqon karaan "heegan" oo aad ku muujineyso bogga. Waxaad ku qori kartaa cutubyadaada fasal sidan oo kale ah:
p {color: # 0000ff; }
p.alert {color: # ff0000; }
Noocyadaasi waxay dejin doonaan midabada dhanba midab buluug ah (# 0000ff), laakiin cutub kasta oo leh dabeecad fasalka ah ee "heegan" ayaa lagu beddeli lahaa casaan (# ff0000). Tani waa sababta oo ah ujeeddada fasalka ay leedahay qaas ka sarreysa marka loo eego xeerka ugu horreeya ee CSS, oo kaliya isticmaalaya xulaha tagtada.
Markaad la shaqeynayso CSS, qawaaniin gaar ah ayaa kaa saari doona mid gaar ah. Sidaa darteed, tusaalahan, xeerka guud ayaa dejiya midabada dhammaan qaybaha, laakiin qaanuunka labaad ee gaarka ah, oo ka badan kan ka soo horjeeda oo dejinaya oo keliya qaybaha qaarkood.
Halkan waxaa ah sida tan loo isticmaali karo calaamadaha HTML:
Qeybtan waxaa lagu soo bandhigi doonaa buluug, taas oo ah tan ugu caansan bogga.
Cutubkani wuxuu kaloo noqonayaa mid buluug ah.
Qaybtan waxaa lagu soo bandhigi doonaa casaan tan iyo dabeecadda fasalka ay ku qoran tahay midabka midabka buluugga ah ee ka soo jeeda qaabka xulashada curiska.
Tusaale ahaan, qaabka "p.alert" wuxuu khuseeyaa kaliya cutubka walxaha isticmaala "heeganka" ee fasalka. Haddii aad rabto inaad isticmaasho fasalka hannaanka badan ee HTML, waxaad si fudud uga saari kartaa halbeegga HTML bilowgii Wicitaanka qaabka (kaliya iska hubi inaad ka baxdid muddada (.) meesha, sida tan:
.alert {midabka midabtakoorka: # ff0000;}
Fasalkan ayaa hadda la heli karaa wax kasta oo loo baahan yahay. Qeyb kasta oo HTML ah oo leh qiime u dhiganta heerka "heegan" ayaa hadda heli doonta qaabkan. In HTML-ka hoose, waxaan leenahay laba weedh iyo heer 2 ah oo isticmaala fasalka "heeganka". Labaduba waxay yeelan doonaan midab-guduud oo casaan ah oo ku saleysan CSS-da oo aan soo bandhigay.
Cutubkani wuxuu ku qoran yahay casaan.
H2 kaas oo sidoo kale casaan noqon lahaa.
On websites maanta, sifooyinka fasalka waxaa badanaa loo isticmaalaa inta ugu badan sababtoo ah waxay ka sahlan yihiin inay ka shaqeeyaan aragti gaar ah oo aqoonsi ah. Waxaad ka heli doontaa bogagga ugu caansan ee HTML si ay u buuxiyaan sifooyinka fasalka, qaar ka mid ah kuwaas oo marar badan lagu soo celiyo dukuminti iyo kuwa kale kuwaas oo laga yaabo inay muuqdaan hal mar.
Doorashada Aqoonsiga
Kombiyuutarka aqoonsiga wuxuu kuu ogolaanayaa inaad magac siiso qaab gaar ah adigoon la xiriirin tag ama wax kale oo HTML ah . Waxaad ku tiri inaad kala qaybsaneyd calaamadda HTML ee ku jira macluumaadka ku saabsan dhacdo.
Waxaad qeybsan kartaa qaybtan aqoonsiga "dhac", ka dibna haddii aad rabto inaad sharaxdo kala qaybinta leh xuduud dhererkiisu yahay 1-pixel oo aad ku qorto lambarka aqoonsiga sidan oo kale:
#event {border: 1px solid # 000; }
Caqabada leh xulashada aqoonsiga waa in aan lagu soo celin karin dokumentiga HTML. Waa inay ahaadaan kuwo u gaar ah (waxaad isticmaali kartaa aqoonsi isku mid ah bogag badan oo ka mid ah boggaaga, laakiin mar kaliya hal dokumenti HTML ah). Sidaa darteed haddii aad haysato 3 dhacdooyin oo dhammaantood u baahdeen xadka, waxaad u baahan doontaa inaad siiso aqoonsiga aqoonsiga "dhacdo1", "event2" iyo "event3" iyo qaab kasta oo iyaga ka mid ah. Sidaa darteed, aad ayay u fududahay in la isticmaalo sifududka fasalka ee "dhacdo" isla markaana ku dhajino dhammaantood hal mar.
Caqabadda kale ee sifooyinka Aqoonsiga ayaa ah inay leeyihiin qaas ka sarraysa sifooyinka heerka. Tani waxay ka dhigan tahay haddii aad u baahan tahay inaad CSS-ga ka saarto qaabka hore loo qaabeeyey, way adkaan kartaa inaad sidaas samayso haddii aad si aad ah ugu tiirsan tahay aqoonsiyada. Sababtaas awgeed in badan oo ka mid ah websiteyaal badan ayaa ka guuray iyaga oo isticmaalaya aqoonsiyada calaamadaha ku jira, xitaa haddii ay doonayaan inay isticmaalaan qiimahaas hal mar, oo waxay bedelaan sifooyinka heerarka gaarka ah ee ku dhow dhammaan noocyada.
Meelaha ay ka mid tahay sifooyinka Aqoonsiga ayaa ciyaaraya waa markaad rabto inaad abuurto bog ay ku xiran yihiin bogag isku xiran. Tusaale ahaan, haddii aad leedahay shabakada qaabka isbarbardhiga oo ay ka kooban tahay dhamaan sheeyada hal bog oo leh xiriirro "boodaya" qaybo kala duwan oo ka mid ah bogga. Tani waxaa la sameeyaa iyadoo la adeegsanayo sifooyinka Aqoonsiga iyo xidhiidhada qoraalka ah ee isticmaala xirmooyinkaas.
Waxaad si fudud kuugu dari lahayd qiimaha sifahaas, oo ka horeysa calaamada #, calaamad href ee xiriiriyaha, sidaan sidan oo kale:
Kanu waa xiriirka
Marka la riixo ama la taabto, xiriirkani wuxuu boodi doonaa qaybta bogga kaas oo leh astaamahan aqoonsiga. Haddii ayan waxba ku qorin bogga qiimaha aqoonsigani, xiriirku waxba ma qaban doono.
Xasuuso, haddii aad rabto inaad abuurto bogga ku yaal bogga, isticmaalka sifooyinka Aqoonsiga ayaa loo baahan doonaa, laakiin waxaad weli u jeedin kartaa fasallo loogu talagalay ujeedooyinka guud ee CSS. Tani waa sida aan u calaamadiyo boggaga maanta - Waxaan isticmaalaa xulashooyinka fasalka inta ugu badan ee suurtogalka ah oo kaliya u leexashada aqoonsiyada marka aan ubaahan karo sifo aan u dhaqmo oo kaliya maahan sida CSS-ka oo kale oo sidoo kale ah bogga bogga.
Maqaalka asalka ah ee Jennifer Krynin. Waxaa sameeyay Edited by Jeremy Girard on 8/9/17