| Home » Articles » WEBSITE DESIGNING |
|
SOMO LA TATU: HTML ELEMENTS Kama tulivyozungumzia katika somo letu la kwanza kuwa HTML element ni kila kitu kilicho baina ya tag mbili pamoja na tag zenyewe. Kwa mfano <b> this is text </b>, hapa lote hilo huitwa HTML element ila ukipunguza tu tag moja hapo inakuwa tena sio html element. Kama tulivyojifunza hapo mwanzo kuwa website nzima hufanyiwa kazi baina ya tag za <body> ……. </body> hivyo basi, katika somo la leo tutajifunza mambo yafuatayo:
Na kumbuka yote haya yatafanyika katika <body> ……………. </body>.
Hii ni tag inayoiamrisha kompyuta kufanya neno kuwa ni kichwa cha habari. Tag hii huandikwa <h1> kwa kufungua na </h1> kwa kufunga, kwa ujumla huwa kama <h1> ……………….. </h1>. Unaweza kujiuliza hiyo namba moja baada ya herufi "h” ni ya nini? Jibu ni kwamba Heading huwa zina madaraja yake, kwa mfano kama ni kichwa cha habari kikuu basi utatumia <h1> , na kama ni kichwa cha habari kinachofuatia basi utatumia <h2> na kama una kichwa cha habari cha tatu tena utatumia <h3>.
Pia ukubwa wa maandishi utatofautiana kulingana na hatua za vichwa vya habari: hebu chukua code hizi hapa chini kisha jaribu katika kompyuta yako uone matokeo yake. <html>
<body>
<h1> Kichwa cha habari kikuu </h1> <h2> Kichwa cha habari cha pili </h2> <h3> Kichwa cha habari kidogo </h3>
</body>
<html>
Maelezo:
Kichwa cha habari kikuu Kichwa cha habari cha pili Kichwa cha habari kidogo
Hii tag hutumika katika kuacha aya (paragraph). Tag yake huandikwa hivi <p> katika kufungua na </p> katika kufunga, ila hata usipoandika tag ya kufunga itafanya kazi. Yaani ukiandika <p> hii ni aya, badala ya <p> hii ni aya </p> zote zitafanya kazi sawa na hii haina namba kama katika kichwa cha habari.
Jaribu code hizi hapa chini:
<html>
<body>
<p> Hii ni paragraph ya kwanza </p> <p> Hii ni paragraph ya pili <p> Hii ni paragraph ya tatu
</body>
<html>
Unapoandika maneno yako katika notepad, hata kama utaacha nafasi kubwa kiasi gani lakini kompyuta haitambui nafasi zaidi ya moja, vilevile unaweza kuwa umemaliza sentensi yako na kutaka kuanza sentensi nyingine katika mstari wa pili, vile vile kwa kuacha nafasi hiyo kompyuta haitambui labda kwa kutumia tag yake maalum iliyowekwa kwa kazi hiyo. Mfano ukiandika: "ninajifunza kusoma na kuandika” na mwenzako akaandika "ninajifunza kusoma na kuandika” nyote wawili mko sawasawa, hiyo nafasi aliyoiacha hapo haitatambulika na kompyuta.
Endapo unataka kuruka mstari ili uanze kuandika katika mstari mwingine tag hii <br> hutumia. Tag hiyo haina tag ya pili. Mfano wake ni kama kuandika hivi:
Watoto wawili wanacheza <br> mama yao anapika <br>Baba yao yuko kazini. Hizi hazitakaa katika mstari mmoja kama unavyoziona bali zitaonekana hivi:
Watoto
wawili wanacheza
Jaribu mwenyewe code hizi hapa: <html>
<body> <h1> Maisha ya Mjini</h1> <p> Hii ni paragraph ya kwanza </p> Watoto wawili wanacheza <br> mama yao anapika <br>Baba yao yuko kazini </body>
<html>
Huu ni mstari unaopigwa kutenganisha sehemu za website yako. Tag yake ni <hr> na haina tag ya kufunga kwani hakuna maandishi yanayotakiwa kufanyika kati yake. Mstari huu huenea eneo zima la website yako kuanzia kulia hadi kushoto, ila ukitaka urefu unaouhitaji basi kuna maelezo ya code yanatakiwa kuongezwa baada ya neno "hr”, tutajifunza katika mada zinazokuja. Jaribu mwenyewe code hizi hapa: <html>
<body> <hr> <h1> Maisha ya Mjini</h1> <hr> <p> Hii ni paragraph ya kwanza </p> Watoto wawili wanacheza <br> mama yao anapika <br>Baba yao yuko kazini <br> Hapa ndio mwisho wa ukurasa huu<br> <hr>
</body>
<html>
Mapaka hapa tumefikia mwisho wa somo letu la tatu, kaa tayari kwaajili ya somo la nne. Kwa maswali, maoni na ushauri jisikie huru kuuliza na kutoa maoni yako hapa chini.
| |
| Views: 848 | | |
| Total comments: 0 | |