Kwa kawaida, mishale ya picha kwenye wavuti hutumiwa kupanga urambazaji. Unapobofya pointer kama hiyo, nenda kwenye ukurasa mwingine au sehemu nyingine ya ukurasa wa sasa. Wakati mwingine vitendo vingine vimefungwa kwao - kuonyesha yaliyomo kwenye uwanja wa lebo, kuzindua hati ya JavaScript, n.k. Ili kusisitiza kuwa mshale huu ni kipengee kinachotumika, tumia athari ya "kuonyesha", i.e. mabadiliko katika muonekano kwenye panya.
Muhimu
Ujuzi wa kimsingi wa lugha za HTML na CSS
Maagizo
Hatua ya 1
Tambua ni utaratibu gani wa kutekeleza utambuzi wa mshale unaofaa kwako. Kuna kadhaa kati yao, mbili rahisi hutolewa katika hatua zinazofuata za maagizo haya. Wote wawili hutumia darasa la bandia la CSS hover. Mshale wa panya unapokuwa juu ya kipengee cha picha (mshale), mtindo ulioelezewa katika darasa hili la uwongo unatumika kwake, na wakati uliobaki mtindo huu haufanyi kazi. Kwa chaguzi zote mbili zilizoelezewa hapo chini, unaweza kutumia HTML sawa nambari, lakini maelezo tofauti ya mtindo. Nambari ya mshale kwenye chanzo cha ukurasa inaweza kuandikwa kama ifuatavyo: Sifa ya kitambulisho inabainisha kitambulisho cha kiunga (mshaleA), ambacho kivinjari kitaamua ni ipi ya maelezo ya mtindo inapaswa kutumiwa kwake.
Hatua ya 2
Chaguo la kwanza litakuhitaji kuandaa picha mbili za mshale - na bila kurudi nyuma. Hifadhi kwenye faili zilizo na majina kama arrON.
mshale #, A # mshaleA: alitembelea {
onyesha: kuzuia;
urefu: 30px;
upana: 100px;
historia: url (arrOFF.gif) hakuna kurudia;
mpaka: 0;
}
mshale #A: hover {
historia: url (arrON.gif) hakuna kurudia;
mpaka: 0;
}
Kizuizi cha kwanza kina vipimo vya mshale (urefu: 30px; upana: 100px;) - ubadilishe na vipimo vya picha zilizo tayari za mshale.
Hatua ya 3
Chaguo la pili hukuruhusu kupata na faili moja tu ya picha. Unahitaji kuweka picha zote mbili za mshale ndani yake - zote zilizoangaziwa na zisizofanya kazi. Unaweza kuziweka kando kando, unaweza moja juu ya nyingine. Katika nambari ya sampuli, tutafikiria kuwa mshale ulioangaziwa umewekwa chini ya ile isiyotumika, na faili imeitwa arr.
mshale #, A # mshaleA: alitembelea {
onyesha: kuzuia;
upana: 100px;
urefu: 30px;
historia: url (arr.gif) hakuna kurudia;
mpaka: 0;
}
mshale #A: hover {
historia: url (arr.gif) hakuna kurudia 31px;
mpaka: 0;
}
Usisahau kurekebisha ukubwa hapa pia.
