Jinsi ya Kuongeza Sanduku La Chini katika Dreamweaver (na Picha)

Orodha ya maudhui:

Jinsi ya Kuongeza Sanduku La Chini katika Dreamweaver (na Picha)
Jinsi ya Kuongeza Sanduku La Chini katika Dreamweaver (na Picha)

Video: Jinsi ya Kuongeza Sanduku La Chini katika Dreamweaver (na Picha)

Video: Jinsi ya Kuongeza Sanduku La Chini katika Dreamweaver (na Picha)
Video: JINSI TA KUPATA VOCHA BURE PAMOJA NA UTHIBITISHO 2024, Aprili
Anonim

WikiHow inafundisha jinsi ya kutumia Adobe Dreamweaver kuunda sanduku la kushuka kwa ukurasa wa wavuti. Masanduku ya kunjuzi ni menyu ambazo "zinashuka" wakati kipengee kwenye ukurasa wako wa wavuti kinabofya, na kuonyesha chaguzi zaidi katika mchakato.

Hatua

Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 1
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 1

Hatua ya 1. Fungua mradi wa Dreamweaver

Bonyeza mara mbili faili ya mradi kufanya hivyo. Ikiwa unataka kuunda mradi mpya wa Dreamweaver, badala yake utafungua Dreamweaver, bonyeza Faili, bonyeza Mpya, na ufuate vidokezo vyovyote vya skrini.

Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 2
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 2

Hatua ya 2. Unda orodha iliyoamriwa

Ili kuunda menyu kunjuzi, lazima uwe na angalau kitu kimoja cha alama ya risasi. Unaweza kuunda hatua ya risasi kwa kuzima CSS (bonyeza Angalia kipengee cha menyu, chagua Utoaji wa Mtindo, na bonyeza Mitindo ya Kuonyesha ikiwa imeangaliwa), kubonyeza mahali ambapo unataka kuongeza nukta, kubonyeza aikoni ya alama ya risasi chini ya dirisha, na kuandika jina la nukta hiyo. Unapaswa kurudi CSS kabla ya kuendelea.

  • Jina la nukta hapa litatumika kama kiboreshaji cha menyu kunjuzi (k.m., kitufe cha juu ya nani anayetembea au kugonga kufungua menyu ya kushuka).
  • Ruka hatua hii ikiwa tayari unayo kipengee cha orodha ambacho unataka kubadilisha kuwa menyu ya kushuka.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 3
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 3

Hatua ya 3. Tambua jina la orodha yako

Bonyeza Kanuni na uhakikishe kuwa uko kwenye Nambari ya Chanzo kuweka, kisha nenda chini kwa nambari ya orodha yako iliyoagizwa (itakuwa kati ya"

"tag na"

"tag) na utafute" "tag juu ya juu"

tag. Neno katika nukuu ni jina la orodha yako.

  • Ikiwa hauoni jina, ingiza lebo (ambapo jina linamaanisha jina unalopendelea la orodha) moja kwa moja juu ya

    lebo.

Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 4
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 4

Hatua ya 4. Ondoa sehemu ya risasi

Hakikisha uko mahali pazuri kwa kubofya faili ya Ubunifu tab na kisha kubonyeza Mbuni wa CSS tab kwenye kona ya juu kulia ya dirisha, kisha fanya zifuatazo:

  • Bonyeza + kulia kwa kichwa cha "Wachaguaji".
  • Andika katika # jina ul ambapo "jina" ni jina la orodha yako.
  • Bonyeza ↵ Ingiza mara mbili.
  • Tembea chini na bonyeza orodha-ya-aina kwenye kidonge chini ya Mbuni wa CSS tab.
  • Bonyeza hakuna katika menyu ya pop-up inayosababisha.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 5
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 5

Hatua ya 5. Badilisha orodha yako iliyoamriwa kuonyesha usawa

Kufanya hivyo:

  • Bonyeza + kulia kwa kichwa cha "Wachaguaji".
  • Andika kwa # jina li ambapo "jina" ni jina la orodha yako.
  • Pata kichwa cha "kuelea" kwenye kidonge chini ya Mbuni wa CSS tab.
  • Bonyeza Kushoto kitufe mara moja kulia kwa kichwa cha "kuelea".
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 6
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 6

Hatua ya 6. Ongeza lebo ya kazi ya orodha yako

Bonyeza + kitufe cha kulia cha "Wachaguaji", kisha andika katika # jina a (ambapo "jina" ni jina la orodha yako) na bonyeza ↵ Ingiza mara mbili.

Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 7
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 7

Hatua ya 7. Ongeza rangi ya mandharinyuma

Chagua # jina a kitu ikiwa ni lazima, kisha bonyeza kichupo kilicho na umbo la sanduku "Rangi ya asili" juu ya Mbuni wa CSS kidirisha, chagua rangi ya asili chaguo, na uchague rangi ya mandharinyuma ya kutumia.

Hii ndio rangi ya vitu ambavyo orodha yako ya kunjuzi itatumia

Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 8
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 8

Hatua ya 8. Fanya vitu vya orodha yako vitumie umbizo la "block"

Fomati hii inahakikisha kwamba wakati mtu anakwenda kubofya au kugonga kitu kwenye orodha, anaweza kuifungua kwa kuchagua kidogo juu au chini yake badala ya kuchagua maandishi kwa usahihi:

  • Hakikisha yako # jina a kipengee kimechaguliwa katika Mbuni wa CSS tab.
  • Nenda chini kwenye kichwa cha "onyesho" kwenye kidirisha.
  • Bonyeza upande wa kulia wa kichwa cha "onyesho", kisha bonyeza kuzuia katika menyu inayosababisha.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 9
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 9

Hatua ya 9. Ongeza padding ikiwa ni lazima

Ukigundua kuwa orodha ya vitu vyako vimepingana, unaweza kuweka nafasi kati yao kwa kufanya yafuatayo:

  • Hakikisha yako # jina a kipengee kimechaguliwa katika Mbuni wa CSS tab.
  • Sogeza chini hadi kwenye kichwa cha "padding" kwenye kidirisha.
  • Badilisha sehemu za juu na chini za "px" kusoma angalau 5.
  • Badilisha sehemu za maandishi "px" za kushoto na kulia ili usome angalau 10.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 10
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 10

Hatua ya 10. Unda rangi ya hover

Hii ndio rangi ambayo itaonekana wakati utapepeta mshale wa panya juu ya kitu kwenye menyu ya kushuka:

  • Bonyeza + kulia kwa kichwa cha "Wachaguaji".
  • Andika kwenye #nave a: hover (ambapo "jina" ni jina la orodha yako) na bonyeza ↵ Ingiza mara mbili.
  • Bonyeza kichupo cha "Rangi ya asili".
  • Chagua rangi ya asili na kisha chagua rangi nyepesi kuliko ile uliyotumia kwa rangi ya asili.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 11
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 11

Hatua ya 11. Zima CSS

Bonyeza Angalia kipengee cha menyu, chagua Utoaji wa Mtindo, na bonyeza Mitindo ya Kuonyesha chaguo katika kidirisha cha kutoka.

Ikiwa Mitindo ya Kuonyesha chaguo ni kijivu nje, bonyeza mahali popote kwenye hati yako ya Dreamweaver na ujaribu tena.

Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 12
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 12

Hatua ya 12. Unda yaliyomo kwenye menyu kunjuzi

Unaweza kufanya hivyo kwa kuongeza vidokezo vidogo chini ya alama ya risasi ambayo unataka kutumia kama kitufe cha menyu kunjuzi:

  • Bonyeza kulia kwa orodha unayotaka kuibadilisha kuwa menyu kunjuzi, kisha bonyeza ↵ Ingiza.
  • Bonyeza Kichupo ↹.
  • Andika kwa jina la kipengee chako cha kwanza cha menyu kunjuzi, kisha bonyeza ↵ Ingiza.
  • Andika kwa jina la menyu inayofuata ya kushuka, kisha bonyeza ↵ Ingiza na urudia kama inahitajika.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 13
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 13

Hatua ya 13. Funga yaliyomo kwenye menyu kunjuzi kwa kipengee cha risasi

Kufanya hivyo:

  • Bonyeza + karibu na "Wachaguaji", kisha andika jina la # ul ul na bonyeza ↵ Ingiza mara mbili.
  • Tembea chini na bonyeza onyesha, kisha bonyeza hakuna katika menyu ya pop-up.
  • Pata na bonyeza nafasi, kisha bonyeza kabisa katika menyu ya pop-up.
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 14
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 14

Hatua ya 14. Unda menyu kunjuzi yenyewe

Itabidi uongeze kichaguzi kingine ili kufanya hivi:

  • Bonyeza + karibu na "Wachaguaji", kisha andika katika # jina ul li: hover> ul na bonyeza ↵ Ingiza mara mbili.
  • Pata na bonyeza onyesha, kisha bonyeza kuzuia katika menyu ya pop-up inayosababisha.
Ongeza Sanduku la Kushuka katika Dreamweaver Hatua ya 15
Ongeza Sanduku la Kushuka katika Dreamweaver Hatua ya 15

Hatua ya 15. Fanya yaliyomo kwenye menyu kunjuzi kuonyesha wima

Kwa chaguo-msingi, yaliyomo kwenye menyu ya kushuka yataonyeshwa kwenye upeo wa usawa, lakini unaweza kuwalazimisha kwenye safu wima kwa kufanya yafuatayo:

  • Bonyeza + karibu na "Wachaguaji", kisha andika jina la # ul ul li na bonyeza ↵ Ingiza mara mbili.
  • Pata kichwa cha "kuelea".
  • Bonyeza "hakuna" () chaguo upande wa kulia wa kichwa cha "kuelea".
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 16
Ongeza Sanduku la Kushuka kwenye Dreamweaver Hatua ya 16

Hatua ya 16. Hifadhi mradi wako

Bonyeza Ctrl + S (Windows) au ⌘ Amri + S (Mac) kufanya hivyo.

Ikiwa umeunda faili mpya ya Dreamweaver kwa mradi huu, utahitaji kuweka jina, chagua eneo la kuhifadhi, na ubofye Okoa ili kuokoa faili yako.

Vidokezo

Ilipendekeza: