picha

CSS - somo la 3: syntax za css yaani sheria za uandishi wa css

Katika somo hili utakwenda kujifunza sheria za uandish wa css yaani syntax za css

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.

credit: w3schools

 

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...

Ingia sasa ili uweze kusoma makala hii yote.

Zoezi la Maswali

Nyuma Endelea


Umeionaje Makala hii.. ?

       
Author: Rajabu image Tarehe: 2024-05-10 14:53:23 Topic: CSS Main: Masomo File: Download PDF Views 1165

Share On:

Share follows: 0 | Unique share links followed: 0
Sponsored links
👉1 Kitabu cha Afya     👉2 Madrasa kiganjani     👉3 Bongolite - Game zone - Play free game     👉4 Dua za Mitume na Manabii     👉5 kitabu cha Simulizi     👉6 Kitau cha Fiqh    

Post zinazofanana:

CSS - SOMO LA 18: Grid Layout

Katika somo hili, utajifunza misingi ya CSS Grid Layout, mfumo wenye nguvu wa kupanga vipengele katika safu (rows) na nguzo (columns). Tutachambua display: grid, pamoja na grid-template-columns, grid-template-rows, gap, grid-column, na grid-row.

Soma Zaidi...
CSS - SOMO LA 27: Kutumia @import Katika CSS

Katika somo hili, tutajifunza kuhusu @import — amri inayotumika kuingiza faili moja la CSS ndani ya jingine. Tutaona namna ya kuitumia, faida zake, hasara zake, na tofauti kati yake na njia mbadala ya <link> ndani ya HTML.

Soma Zaidi...
CSS - SOMO LA 15: Float na Clear katika CSS

Katika somo hili utajifunza jinsi ya kutumia float ili kupanga elementi upande wa kushoto (left) au kulia (right). Pia utajifunza jinsi ya kutumia clear kuondoa athari za float na kuhakikisha layout yako inabaki thabiti.

Soma Zaidi...
CSS - SOMO LA 31: CSS Filters (blur, brightness, contrast.)

Katika somo hili tutajifunza kuhusu CSS Filters — mitindo inayotumika kuhariri mwonekano wa picha, video, au elementi nyingine kwa kuongeza athari kama blur, brightness, contrast, grayscale, na nyinginezo. Hii huifanya tovuti kuwa ya kisasa, ya kuvutia, na yenye mwingiliano mzuri.

Soma Zaidi...
CSS - SOMO LA 7: Kutumia Fonti (Fonts) kwenye CSS

Katika somo hili utajifunza jinsi ya kudhibiti mwonekano wa maandishi kwa kutumia fonti kwenye CSS. Utajifunza jinsi ya kubadilisha aina ya fonti, ukubwa, mtindo, unene, na mpangilio wa maandishi ili yaweze kuonekana kwa mvuto na usomaji bora.

Soma Zaidi...
CSS - SOMO LA 25: CSS Shorthand Properties

Katika somo hili tutajifunza kwa kina kuhusu CSS Shorthand Properties — ni nini, jinsi zinavyofanya kazi, faida zake, na mifano mbalimbali ya kutumia shorthand kuandika CSS kwa njia fupi na bora zaidi.

Soma Zaidi...