Sheria za uandishi wa css yaani syntax za css.
Css ni moja katika lugha za ki kompyuta (computer language) ambayo ina sheria zilizo rahisi sana na ni chache. Ukishazijuwa hizo basi mabo yote yatakuwa sawa.
Sheria za kuandka css zimezama kwenye mambo makuu mawili tu ambayo ni selector na declaration. Yaani code zote za css unaweza kuzigawa kwenye sehemu kuu hizi mbili ambazo ni selector na declaration.
Selectors: hii ni sehemu ambayo yenyewe inahusisha element za html. Yaani hapa ndipo tunakwenda kujuwa je hizo code za css zinahud element gani. Mfano ukisema
haloo
katika code hizi selector ni
ambapo inaonesha kuwa tuna target paragraph.
Declaration: hii ni sehemu ambayo inakwenda kuweka code za css. Declaration yenyewe imegawanyika katika sehemu kuu mbili ambazo ni property na value. Kwa mfano katika mfano niliotoa hapo juu declaration ni color:yellow ambapo tunapata color ni property na yellow ni value.
Kwa ufupi selector ina kuwa na tag husika ya html na declaration inakuwa na protery pamoja na value. Declaration inakuwa kwenye mabano ya {} kama utatumia internal css ama external css.
Selector inaweza kuwa zaidi ya moja na declaration pia inawezakuwa zaidi ya moja. Jambo la kuzingatia nikiwa unapotumia selector zaidi ya Moja utatakiwa kuzitenganisha kwa alama ya koma (,). Na unapotumia declation zaidi ya Moja utatenganisha kwa kutumia semicolon (;). Angalia mfano hapo chini
p, h1, u, i, b{
color:blue;
font-size:200%;
background: red;
}
Katika code hizi selectors ni p, h1, u, i na b hizi zinatarget tag za html. Tag hizo ni <p>, <h1>, <u>, <i> na <b>. Kwa pamoja element hizo zote zitafuata style hiyo popote zitakapotumiwa.
Pia hapo kuna declaration tatu ambazo ni color:blue yenye property color na value blue, font-size:100% yenye property font-size na value 100%, na ya mwisho ni background-color:red yenye property background-color na value red.
Baada ya kutambuwa kuhusu sheria hizo basi unaweza kuandika cess kwa msaada wa masomo yaliotangulia.rejea njia za kutumia css kwenye faili la html.
Jinsi ya ku comment: Ni kawaida kwa kila lugha ya kompyuta kuweka namna ya ku comment ili kuwezesha watu kuweka kumbukumbu fulani. Tofauti na html ambayo hutumia <!-- –> katika ku comment css hutumia alama hizi /* */
p, h1, u, i, b{
/*rangi ya buluu */
color:blue;
font-size:200%;
background: red;
/*pia unaweza kujifunza
zaidi kuhusu jinsi
ya ku comment
*/
}
Kama unavyoona hapo nimecomment mstari mmoja, pia nikakoment kwa mistari zaidiya mmoja kwa kutumia alama zile zile.
Inheritance: maana yake ni kurithi. Hii ni sheria muhimu sana kuijuwa.ili uijuwe vyema zingatia haya:-
Katika HTML element kuna ambazo ni parent na kuna children. Mfano element <body> nii ni parent ambapo ndani yake kuna element nyingi zinazounda maudhui ya faili husika. Kama kama <body> utaipa style basi style hiyo ita athiri faili lote. Kwa maana ukisema body{color:red} ina maana ement zote zitakuwa na rangi nyekundu
Pia element child inaweza ikawa na element nyingine ndaniyake. Kwa mfano element <p> ndani yake inaweza kubeba element kama b, i, u ambapo style utakayoiweka kwenye <p> itaweza ku athiri element zote zilizopo humo.
Sasa katika sheria hii ni kuwa code zilizo juu zinaweza athiri vilivyochini hata hivyo endapo utaweka style kwa code zinazofuata zitachukuwa style hiyo mpya. Mfano kwenye <body> unaweza kuset rangi ya maandishi kuwa ya buluu kwamfano, kisha kwenye <p> ukaiset iwe namaandishi ya kijani. Sasa hapa sheria ya inheritance haitafanya kazi kwa sababu imekutana na sheria ndogondogo.
Halikadhalika pia zingatia haya:-
Style za external css zinaweza kuvunjwa na internal css
Style za internal css zinaweza kuvunjwa na inline css
Sheria za inline css zinaweza kuvunjwa kwa kutumia id selector. Tutakuja jifunza aina za selecto
Mwisho:
Katika somo linalofuata utakwenda k
ujifunza aina za selector
