He aratohu taahiraa-taahiraa
Ahakoa ko te tahua whakatere he rarangi whakapae i runga i te tihi, i te rarangi poutū ranei i te taha o te taha, kei te mea he rārangi anake. A, no te hoahoa i te whakatere tukutuku, he mea ngawari ki te wareware ko te mahinga whakatere he wahanga whakahonorehia o nga hononga. Engari ki te whakahaere koe i to whakatere ma te whakamahi i XHTML + CSS, ka taea e koe te hanga i tetahi tahua iti ki te tiki (te XHTML) me te ngawari ki te whakarite (te CSS).
Tīmatahia
Hei tīmata ki te hoahoa i te raupapa mo te whakatere, me whakamahi koe i te rārangi.
Ka waiho pea he raupapa paerewa paerewa kua tautuhia hei whakatere:
Mena ka titiro koe ki te HTML, ka kite koe i te hono o te "Home" ki te ID o youarehere. Ma tenei ka taea e koe te hanga i tetahi tahua e tautuhi ana i te tauwāhi o nāianei mo o kaipānui. Ahakoa kaore koe e whakamahere ki te whakauru i taua momo whakaaturanga ataata i to papaanga inaianei, ka taea e koe te whakauru i taua korero. Mena ka whakatau koe ki te whakauru i te tohu i muri mai, ka iti ake te taatai ki te whakarite i to pae.
Kaore he mahinga CSS , ko tenei tahua XHTML rite he raupapa paparangi kore. He pupuhi me nga taonga taatai he iti noa iho. No te mea kei te whakamahi ahau i nga hono o nga kaipupuri , kaore te nuinga o nga kaitoro e whakaatu mai i nga hononga kia rite ki te whakamahinga (i raro i te waahanga me te puru). Mena ka whakapiri koe ki te HTML i runga ake nei ki roto i te Tukutuku Tukutuku, ka penei to whakatere:
- Home
- Hua
- Ratonga
- Whakapā mai
He tino whakawehi tenei, a, kaore e ahua nui ana ki te tahua. Engari me etahi momo CSS anake i tapiritia ki te rarangi, ka taea e koe te hanga i tetahi tahua e whakapehapeha ana koe.
Tahua Takahuri Poutū
He tino ngawari te tuhi i te tahua whakatere poutū, no te mea kei te whakaatu i te ahua ano he raupapa noa: i runga, i raro.
Ko nga mea taatai e whakaatu ana i te taha o te wharangi.
I te wa e mahi ana au i nga menus, e hiahia ana ahau ki te timata i waho me te mahi i roto i tenei. Ko tenei, ko taku tikanga ko te ahua tuatahi o te whakaterenga me te neke atu ki nga huinga me nga hono, me era atu. Na mo tenei tahua, Tuatahi tautuhi koe i te whanui o te tahua. Ma tenei ka whakarite ahakoa he roa nga taonga tahua, kaore e pana te toenga o te taaphinga i runga i te whakawhiti whakawhiti ranei.
ul # navigation {whanui: 12em; }
Kia tae mai ki te whanui, ka taea e au te takaro me nga taonga taatai. Ka taea e au te tautuhi i nga mea penei (ki te peke i nga puranga), te papamuri, nga rohe, te whakawhiti kuputuhi, me nga taapete.
ul # navigation li {
rārangi rārangi: kahore;
karaehe-tae: # 039;
rohe-runga: maroke 1px # 039;
kuputuhi-taurangi: maui;
tapaina: 0;
}
Kia whakaturia e koe nga kaupapa mo nga mea rarangi ka taea e koe te tīmata ki te takaro me te ahua o te tahua i roto i te rohe hono. Te ahua tuatahi i te UL # navigation LI A me te hononga A: hono, A: i tae mai, A: hover, a A: kaha (ki te hiahia koe). Mo nga hononga, e hiahia ana ahau ki te hanga i nga hononga he mema poraka (kaore i te taunoa). Ko tenei ka kaha ki a ratou ki te tango i te waahi katoa o te LI-me te mahi ano i te paraka, na te mea kawari ake te tahua hei tautuhinga taatau.Ko tetahi atu mea e mahia tonu ana e ahau ko te tango i te raina (te whakapaipai kuputuhi: kahore;); na te mea e hangaia ana e nga pihini nga pirangi penei ki ahau.
Engari, he rereke to hoahoa.
ul # navigation a a {
whakaatu: poraka;
whakapaipai kuputuhi: kahore;
pakaru: .25em;
rohe-raro: pakiaka 1px # 39f;
rohe-matau: pakari 1px # 39f;
}
Kia mahara ko te whakaatu: poraka; i runga i nga hononga, ko te pouaka katoa o te tahua tahua e pāwhiri ana, ehara i nga reta anake. He pai hoki tenei mo te whakamahi. Me whakarite ki te tautuhi i nga tae hono (hononga, torotoro, paari me te kaha) ki te hiahia koe kia rere ke atu i te puru, te whero me te papura.
a: hono, a: tae atu ki te {tae: #fff; }
a: hover, a: kaha {color: # 000; }
Ko taku hiahia ki te tuku i te ahua hover he iti ake te aro ma te huri i te tae papamuri.
a: hover {papamuri-tae: #fff; }
Mena ka hiahia koe ki etahi atu tauira o nga menu poutū, tirohia te rarangi i raro nei.
- He Tahua Poutū Tae
- He Tae Tahua Poutū Ake
- He Tahua Matapihi Whaiaro kei a koe kei konei
- He Ahua Tahua Matapihi Toi Maehe Kei a koe Kei konei
Whakaahua Whakaterenga Whakapae
Ko te hanga i nga tahua whakatere whakapae he iti ake te uaua atu i nga mena whakatere poutini no te mea he mea whakaiti koe i te mema e hiahia ana nga pae HTML ki te whakaatu poutū. Kia rite ki te tahua whakapae, tuatahi te waihanga i to rarangi tahua whakatere :
Hei waihanga i te tahua whakapae, mahi rite ano ki a koe ki te tautuhinga poutū. Tīmata ki te waho me te mahi i roto i. Mai i taku hiahia kia tīmata taku whakatere ki te kokonga maui, ka whakaturia e ahau ki te taha maui o te taha maui, me te panuku, a ka hurihia e ahau ki te maui. Me whakauru ano hoki koe ki te tautuhi i te whanui kia kore ai to tahua e nui atu iti iho iti atu i to hiahia. Mo nga menus whakapae, koinei te whanui o te hoahoa. I tapiritia ano e ahau he tae papamuri ki te rarangi katoa kia pai ake ai te korero.
ul # navigation {
rererangi: te maui;
tapaina: 0;
te papaha: 0;
whanui: 100%;
karaehe-tae: # 039;
}
Ko te mea ngaro ki te tahua whakatere tawhito kei roto i nga taonga rarangi. Ko nga mea taatai ka tarai i ngaa waahanga, ko te tikanga ko te waahanga hou e whakaturia ana i mua atu, i muri i ia waahanga. Ma te huri i te whakaaturanga mai i te poraka ki te raina, ka kaha koe ki te tautuhi i ngaa waahi paparangi ki te tuhono i te taha o tetahi ki tetahi.
ul # navigation li [whakaatu: inline; }
I mahia e ahau nga hononga kia rite ki taku mahi ki a ratou i roto i te mahinga whakatere poutū, me nga tae ano me te whakapaipai kuputuhi. I tapiritia e ahau tetahi pito ki runga ki te whakaatu i nga pihi ka pekehia ana. Ko te mea anake i tangohia e ahau ko te whakaaturanga: poraka; na te mea ka whakauruhia nga waahanga hou ka whakangaro i te tahua whakapae.
ul # navigation a a {
whakapaipai kuputuhi: kahore;
taraiha: .25em 1em;
rohe-raro: pakiaka 1px # 39f;
rohe-runga: maroke 1px # 39f;
rohe-matau: pakari 1px # 39f;
}
a: hono, a: tae atu ki te {tae: #fff; }
ul # navigation a a: hover {
tae-tae: #fff;
tae: # 000;
}
Kei konei koe te korero
Ko tetahi atu waahanga o te HTML ko te tohu tuakiri. Mena e hiahia ana koe ki te whakarereke i to tahua hei whakaatu i te tauranga o to kaiwhakamahi, kei te whakamahi i tenei ID hei tautuhi i tetahi tae papanga rereke, i tetahi atu momo. Whakanuia taua huanga ID ki te tahua tahua tika i runga i etahi atu whārangi kia whakamaramahia ai te whārangi o teianei.
ul # navigation li # youarehere a [taiao-tae: # 09f; }
Mena ka taahitia e koe enei momo ki o taangata, ka taea e koe te hanga he papa taapiri whaitiki ranei e mahi ana ki to pae, engari he tere ki te tikiake me te tino ngawari ki te whakahou i te wa kei te heke mai. Mā te XHTML + CSS e huri i ō rārangi hei taonga tino kaha mo te hoahoa.
Mena ka hiahia koe ki etahi atu tauira o nga mena whakapae, tirohia te mea e whai ake nei.
- He Tahua Whakaatu Tae
- He Tae Aratau Whakaaturanga Matua
- He Mahinga Whakaaturanga Whaiaro kei a koe kei konei
- He Ahua Tahora Whakaaturanga Rautaki Maehe Kei a koe Kei konei