Itinuturo sa iyo ng wikiHow na ito kung paano gamitin ang Adobe Dreamweaver upang lumikha ng isang drop-down na kahon para sa isang webpage. Ang mga drop-down box ay mga menu na "drop down" kapag na-click ang isang item sa iyong webpage, na nagpapakita ng maraming mga pagpipilian sa proseso.
Mga hakbang
Hakbang 1. Magbukas ng isang proyekto ng Dreamweaver
I-double click ang file ng proyekto upang magawa ito. Kung nais mong lumikha ng isang bagong proyekto ng Dreamweaver, sa halip ay buksan mo ang Dreamweaver, mag-click File, i-click Bago, at sundin ang anumang mga prompt sa-screen.
Hakbang 2. Lumikha ng isang order na listahan
Upang makalikha ng isang drop-down na menu, dapat kang magkaroon ng kahit isang item na point-bullet. Maaari kang lumikha ng isang punto ng bala sa pamamagitan ng pag-off sa CSS (i-click ang Tingnan menu item, piliin ang Pag-render ng Estilo, at i-click Mga Estilo ng Display kung nasuri ito), pag-click sa lokasyon kung saan nais mong idagdag ang point, pag-click sa icon ng point ng bala sa ilalim ng window, at pagta-type sa pangalan ng point. Pagkatapos ay dapat mong i-on muli ang CSS bago magpatuloy.
- Ang pangalan ng puntong ito ay magsisilbing activator ng iyong drop-down na menu (hal., Ang pindutan kung saan ang isa ay mag-hover o mag-tap upang buksan ang drop-down na menu).
- Laktawan ang hakbang na ito kung mayroon ka ng isang item sa listahan na nais mong i-convert sa isang drop-down na menu.
Hakbang 3. Tukuyin ang pangalan ng iyong listahan
I-click ang Code tab at tiyakin na ikaw ay nasa Source Code setting, pagkatapos ay mag-scroll pababa sa code ng iyong order ng listahan (ito ay nasa pagitan ng isang"
"tag at isang"
"tag) at hanapin ang" "tag sa itaas ng tuktok"
tag. Ang salita sa mga sipi ay pangalan ng iyong listahan.
-
Kung hindi ka nakakakita ng isang pangalan, ipasok ang tag (kung saan ang pangalan ay tumutukoy sa iyong ginustong pangalan ng listahan) nang direkta sa itaas ng
tag
Hakbang 4. Alisin ang (mga) point ng bala
Tiyaking nasa tamang lugar ka sa pamamagitan ng pag-click sa Disenyo tab at pagkatapos ay pag-click sa Disenyo ng CSS tab sa kanang sulok sa itaas ng window, pagkatapos ay gawin ang sumusunod:
- Mag-click + sa kanan ng heading na "Mga Pumipili".
- I-type sa #name ul kung saan "pangalan" ang pangalan ng iyong listahan.
- Pindutin ang ↵ Ipasok nang dalawang beses.
- Mag-scroll pababa at mag-click listahan-style-type sa pane sa ilalim ng Disenyo ng CSS tab
- Mag-click wala sa nagresultang pop-up menu.
Hakbang 5. Baguhin ang iyong order na listahan upang maipakita nang pahalang
Upang gawin ito:
- Mag-click + sa kanan ng heading na "Mga Pumipili".
- Mag-type sa #name li kung saan ang "pangalan" ang pangalan ng iyong listahan.
- Hanapin ang heading na "float" sa pane sa ilalim ng Disenyo ng CSS tab
- I-click ang Kaliwa kaagad na pindutan sa kanan ng heading na "float".
Hakbang 6. Magdagdag ng isang aktibong tag para sa iyong listahan
I-click ang + button sa kanan ng "Selectors", pagkatapos ay i-type ang #name a (kung saan ang "pangalan" ang pangalan ng iyong listahan) at pindutin ang ↵ Ipasok dalawang beses.
Hakbang 7. Magdagdag ng isang kulay ng background
Piliin ang #pangalan a item kung kinakailangan, pagkatapos ay i-click ang hugis na kahon na "Kulay ng background" na tab sa tuktok ng Disenyo ng CSS pane, piliin ang kulay ng background pagpipilian, at pumili ng kulay ng background na gagamitin.
Ito ang kulay na gagamitin ng mga item ng iyong drop-down list
Hakbang 8. Gawin ang iyong mga item sa listahan na ang format na "block"
Tinitiyak ng format na ito na kapag ang isang tao ay nag-click o nag-tap sa isang item sa listahan, maaari nila itong buksan sa pamamagitan ng pagpili ng bahagyang nasa itaas o sa ibaba nito sa halip na piliing piliin ang eksaktong teksto:
- Siguraduhin na ang iyong #pangalan a ang item ay napili sa Disenyo ng CSS tab
- Mag-scroll pababa sa heading na "display" sa pane.
- I-click ang kanang bahagi sa heading ng "display", pagkatapos ay i-click harangan sa nagresultang menu.
Hakbang 9. Magdagdag ng padding kung kinakailangan
Kung napansin mo na ang iyong mga item sa listahan ay masikip laban sa bawat isa, maaari kang maglagay ng ilang puwang sa pagitan nila sa pamamagitan ng paggawa ng mga sumusunod:
- Siguraduhin na ang iyong #pangalan a ang item ay napili sa Disenyo ng CSS tab
- Mag-scroll pababa sa heading na "padding" sa pane.
- Baguhin ang mga patlang na teksto ng "px" sa itaas at ibaba upang mabasa ang hindi bababa sa 5.
- Baguhin ang kaliwa at kanang mga patlang ng teksto na "px" upang mabasa ang hindi bababa sa 10.
Hakbang 10. Lumikha ng isang kulay na hover
Ito ang kulay na lilitaw kapag pinapasada mo ang iyong mouse cursor sa isang item sa drop-down na menu:
- Mag-click + sa kanan ng heading na "Mga Pumipili".
- I-type ang #nave a: hover (kung saan "pangalan" ang pangalan ng iyong listahan) at pindutin ang ↵ Ipasok dalawang beses.
- I-click ang tab na "Kulay ng background".
- Pumili kulay ng background at pagkatapos ay pumili ng isang mas magaan na kulay kaysa sa ginamit mo para sa kulay ng background.
Hakbang 11. I-off ang CSS
I-click ang Tingnan menu item, piliin ang Pag-render ng Estilo, at i-click ang Mga Estilo ng Display pagpipilian sa pop-out window.
Kung ang Mga Estilo ng Display ang pagpipilian ay greyed out, mag-click kahit saan sa iyong dokumento ng Dreamweaver at subukang muli.
Hakbang 12. Lumikha ng mga nilalaman ng drop-down na menu
Maaari mo itong gawin sa pamamagitan ng pagdaragdag ng mga sub-point sa ibaba ng point ng bala na nais mong gamitin bilang pindutan ng drop-down na menu:
- Mag-click sa kanan ng item sa listahan na nais mong gawing isang drop-down na menu, pagkatapos ay pindutin ang ↵ Enter.
- Pindutin ang Tab ↹.
- I-type ang pangalan ng iyong unang drop-down na item sa menu, pagkatapos ay pindutin ang ↵ Enter.
- I-type ang pangalan ng susunod na drop-down na menu, pagkatapos ay pindutin ang ↵ Enter at ulitin kung kinakailangan.
Hakbang 13. Itali ang mga nilalaman ng drop-down na menu sa isang item sa bala
Upang gawin ito:
- Mag-click + sa tabi ng "Selectors", pagkatapos ay i-type ang #name ul ul at pindutin ang ↵ Ipasok dalawang beses.
- Mag-scroll pababa at mag-click ipakita, pagkatapos ay mag-click wala sa pop-up menu.
- Hanapin at i-click posisyon, pagkatapos ay mag-click ganap sa pop-up menu.
Hakbang 14. Lumikha mismo ng drop-down na menu
Kailangan mong magdagdag ng isa pang tagapili upang magawa ito:
- Mag-click + sa tabi ng "Selectors", pagkatapos ay i-type ang #name ul li: hover> ul at pindutin ang ↵ Ipasok dalawang beses.
- Hanapin at i-click ipakita, pagkatapos ay mag-click harangan sa nagresultang pop-up menu.
Hakbang 15. Gawing patayo ang mga nilalaman ng drop-down na menu
Bilang default, ang mga nilalaman ng drop-down na menu ay ipapakita sa isang pahalang na bar, ngunit maaari mong pilitin ang mga ito sa isang patayong haligi sa pamamagitan ng paggawa ng mga sumusunod:
- Mag-click + sa tabi ng "Selectors", pagkatapos ay i-type ang #name ul ul li at pindutin ang ↵ Ipasok nang dalawang beses.
- Hanapin ang heading na "float".
- I-click ang "none" () pagpipilian sa kanan ng heading na "float".
Hakbang 16. I-save ang iyong proyekto
Pindutin ang Ctrl + S (Windows) o ⌘ Command + S (Mac) upang gawin ito.
