Ad Code

JIFUNZE HTML KWA KISWAHILI toleo la 2

html screen

katika chapisho lililopita tuliangalia kwa undan kidogo nini maana ya HTML na n faida zipi unaweza kuzipata unapo jifunza lugha ya HTML pia tuligusia namna na jinsi ya kuandika na kuona out put ya code zako kwa kutumia simu yako ya mkononi au kompyuta yako

kama hukusoma mafunzo ya HTML level 1 bonyeza hapaMAFUNZO YA HTML KWA KISWAHILI LEVEL ONE (1)

YALIYOMO

Katika chapisho hili tutaangalia zaidi kuhusu

  1. Orodha (lists)
  2. HTML tables.

1. LIST(orodha)

Tunaweza kuorodhesha vitu mbalimbali katika kurasa zetu za kimtandao(webpages). kuna aina mbili za kuorodheshwa vitu,

(i) kuorodhesha bila kutumia namba

(ii) kuorodhesha kwa kutumia namba.

I: Orodhesha vitu bila kutumia namba.

Kuorodhesha vitu bila kutumia namba tumia utambulisho(tag) wa < ul> na kila kitu kinacho orodheshwa lazima kianze na utambulisho (tag) wa < li>.

mfano

Orodha hapo juu ita orodhesha kwa kutumia viduara vidogo vyeusi. KAMA INAVYOONEKANA HAPA CHINI.

matokeo

Mabingwa wa nchi

  • Young Aftica
  • Simba Sport Club
  • Geita Gold

Pia waweza orodhesha Vitu vyako kwa kutumia miraba midogo midogo kwa kuongeza mtindo (style) wa < ul style "list-style-type:square"> ul -inaelezea aina ya mtindo. list-style-inaelezea mtindo wa orodha kwenda chini type:square- muonekano wa umbo alama linalotumika kuorodhesha vitu, umbo alama hilo miraba midogo midogo(square).Kubadilsha umbo Alama toa neno square weka aina nyingine ya umbo alama.

mfano

matokeo

Mabingwa wa nchi

    • Young Aftica
    • Simba Sport Club
    • Geita Gold

II: Orodhesha vitu kwa kutumia nambari.

Kuorodhesha vitu kwa kutumia namba utambulishwa kwa utambulisho (tag) wa < ol> na kila kitu kinacho orodheshwa lazima kianze na utambulisho < li>

mfano

matokeo

Mabingwa wa nchi

    1. Young Aftica
    2. Simba Sport Club
    3. Geita Gold

kama hukosoma mafunzo ya HTML toleo la kwanzaBONYEZA HAPA


2. HTML tables(majedwali)

HTML table ni kapu linalokusanya nyaraka mbalimbali.HTML table hutambulishwa na utambulisho (tag) wa < tr>. Kichwa cha table (table Header) hutambulishwa na utambulisho(tag) wa (th). Data ndani ya table hutambulishwa na utambulisho (tag) wa < td>.

mfano

matokeo

Jina la timu idadi ya magori point
Yanga 85 38
Simba 69 20
Pamba fc 13 7

Sasa ndugu msomaji umeona table ya juu hapo haina mipaka(borders) hebu tuangalie namna ya kutengeneza table yenye mipaka(borders)

TABLE ZA HTML ZENYE MIPAKA(HTML TABLE BORDER)

Tunaweza kutengeneza table ya HTML yenye mipaka kwa kutumia lugha CSS inayosaidia kuonyesha muonekano wa kurasa yako ya kimtandao(webpages).

mfano

table,the,td{ border:1px solid black; }

border:1px solid blacks; - Kanuni (code) inayoelezea ukubwa wa mpaka ambao ni 1px na rangi ya mpaka ambayo ni black.

-Mpangilio mzima wa lugha ya HTML unaotengeneza table ya HTML inayoonyesha mipaka kwenye kurasa za kimtandao (webpages).

matokeo

Jina la Kampuni Jina la Muanzilishi Eneo iliyopo
Hackers academy Charlie syllas #op3sk*3
House of romance lusatho yohana Mwanza
Delicious foods Co Wigos syllabus Tabora na Iringa

UFAFANUZI

< head> -mwanzo wa sehemu ndogo ya HTML

-mwisho wa sehemu ndogo ya HTML

ZINGATIA: Muonekano / mtindo wa mpaka wa table unatengenezwa ndani ya sehemu ndogo ya HTML < head>.

< style>-Mwanzo wa mtindo unaotengeneza muonekano wa mpaka ndani ya table ya HTML. < /style>-Mwisho wa mtindo unaotengeneza muonekano wa mpaka ndani ya table HTML.

ZINGATIA: Mtindo au muonekano wa mpaka wa table za HTML unatengenezwa ndani ya sehemu ndogo yaani ndani ya < head>(katikati ya < head> na < /head>

table, th,td { border:1px solid black; }-inaonyesha mtindo wa mpaka unaotengenezwa ndani ya < style> (Katikakati ya < style> na < /style>

< table style="widht:100%> -inaonyesha mtindo au muonekano wa upana wa table ya HTML ambayo ni upana wa 100%.

< /table> - mwisho wa mtindo au muonekano wa upana wa table ya HTML.

TABLE YA HTML ISIYOKUWA NA VIJUMBA NDANI (HTML TABLE COLLAPSED BORDERS)

Pia tutatumia lugha ya CSS kutengeneza table ya HTML isiyokuwa na vijumba ndani yake.

Mfano.

border:1px solid blacks; - Kanuni (code) inayoelezea ukubwa wa mpaka ambao ni 1px na rangi ya mpaka ambayo ni black.

border-collapse:collapse; -ni kanuni (code) inayozuia utengenezwaji wa vijumba ndani table ya HTML.

mpangilio wa kanuni(code) zinazo oshesha table isiyp na vijumba kwenye mipaka(border)

matokeo

Jina la Kampuni Jina la Muanzilishi Eneo iliyopo
Charlie syllas hackers gheto code plot 342*643#
Lusato chimodoi mapenzi moto moto Mwanza na Nairobi
Maria revocartus Know who you are Dodoma

ZINGATIA:

kanuni (code) za table zikiandikwa kwenye ukurasa mmoja unaweza kuathiri muonekano wa hizo table, ikiwa umeona table zote zinafanana kimuonekano tafadhari nakili hizo kanuni (code) kwenye notepad au trebEdit yako kisha hifadi na ufungue uhakiki muonekano wa hizo table

kama hukusoma mafunzo ya html level one BONYEZA HAPA

Leo tumejifunza zaidi kuhusu list na table za HTML panapo majaaliwa yake mwenyez mung tutaangalia zaidi kuhusu features nyingi za HTML pia mwisho wa mafunzo haya tutaangalia namna ya kuhosti code zetu kuwa website
Pia maoni yako ni muhimu sana tafadhali tuandikie maoni yako hapo chini kwenye kibox kilicho andikwa "POST A COMMENT"

Au niandikie kwenye ukurasa wangu wa Facebook BONYEZA HAPA!!

Ahsante!!!

Post a Comment

0 Comments