Jinsi Ya Kuunda Menyu Ya Kidukizo

Orodha ya maudhui:

Jinsi Ya Kuunda Menyu Ya Kidukizo
Jinsi Ya Kuunda Menyu Ya Kidukizo

Video: Jinsi Ya Kuunda Menyu Ya Kidukizo

Video: Jinsi Ya Kuunda Menyu Ya Kidukizo
Video: Как самому создать QR-код в Google-таблицах? +Как создавать красивые QR-коды! 2024, Mei
Anonim

Kwa msaada wa nambari inayofaa ya HTML na sheria rahisi za CSS, unaweza kuunda menyu ibukizi, kuiongezea na kuirekebisha. Kwa kutumia meza za kuachia na zana za lugha markup, unaweza kuhakikisha kuwa menyu yenyewe inafanya kazi kwa usahihi katika vivinjari vyote.

Jinsi ya kuunda menyu ya kidukizo
Jinsi ya kuunda menyu ya kidukizo

Maagizo

Hatua ya 1

Shikilia kwenye bar ya menyu ya msingi kwanza. Unda orodha maalum iliyohesabiwa na menyu ndogo kwenye kihariri cha maandishi. Kawaida "Notepad" hutumiwa kwa madhumuni haya. Menyu ndogo hufanya kama sehemu ya orodha ya mzazi. Kwa mfano: Kipengele cha kwanzaKifungu cha Maji

Hatua ya 2

Hifadhi orodha hii katika faili tofauti ya html. Kisha unda faili ya.css. Ingiza vigezo vyote vya karatasi vya mtindo. Fanya hivi kwa uangalifu sana, kwa sababu kosa moja, na menyu ya pop-up haitaonyesha kwa usahihi au haitafanya kazi kabisa.

Hatua ya 3

Ondoa risasi na pedi zilizowekwa kwenye orodha ya risasi. Weka upana wa menyu ukitumia zana za CSS: ul -style: none, width: 200px; }

Hatua ya 4

Tia alama msimamo wa jamaa wa vitu vyote kwenye orodha na sifa inayoitwa nafasi: ul li: jamaa; }

Hatua ya 5

Kisha panga menyu ndogo, ambayo vitu vyake vitaonekana kutoka kwenye menyu ya mzazi kwenda kulia wakati mshale wa panya umekwisha juu ya bidhaa: li ul: absolute; kushoto: 199px; juu: 0; onyesha: hakuna; }

Hatua ya 6

Sifa ya kushoto ni pikseli moja chini ya upana wa menyu yenyewe. Hii inaruhusu vitu vya pop-up kuwekwa vyema bila kuunda mipaka miwili. Sifa ya kuonyesha hutumiwa kuficha menyu ndogo wakati wa kufungua ukurasa.

Hatua ya 7

Mtindo viungo kama inahitajika kutumia chaguzi sahihi css. Jumuisha kuonyesha: kuzuia parameta ili viungo vitumie nafasi yote iliyohifadhiwa kwao. Ili kufanya menyu ionekane wakati mshale wa panya unapita juu yake, ingiza nambari ifuatayo: li: hover ul: block; }

Hatua ya 8

Weka chaguzi za ziada za kuonyesha vitu vya orodha na viungo kama unavyotaka. Jumuisha sifa kwenye faili ya.html. Menyu ya pop-up iko tayari kutumika.

Ilipendekeza: