在网页中我们经常会接触到各式各样的菜单,跳转菜单就是其中一种,这里我们来一起学习一下跳转菜单的制作,我们选用的是dreamweaver软件来完成跳转菜单的制作。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/3fe32442a07aa0107d27798bbfbb19efa35f3ea8.jpg)
工具/原料
dreamweaver软件
前期准备:
1、 打开dreamweaver软件,选择“创建新项目”中的“Html”。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/35fa07efa25f0c14056f47310d89a146b6b138a8.jpg)
2、 单击菜单栏中的“插入”——表单——跳转菜单。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/d3c39889a146b7b122edea0ec77c34b33d4135a8.jpg)
3、 在弹出的“插入跳转菜单”对话框中,单击“+”按钮,可以增加菜单项;单击“-”按钮,可以删除菜单项,菜单项在下面的列表中显示。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/35f2224133bad341d0697484427622bc7cc52ca8.jpg)
4、 现在选定“菜单项”列表中的菜单项,在“文本”框中输入新的名称。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/7c84d1672b5fd546de822da77fd0b503c9d224a8.jpg)
5、 选定“插入跳转菜单”对话框中的菜单项,单击“浏览”按钮。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/460fdc8333bf3befd05bc50b3f3ea8db564a1aa8.jpg)
6、 在弹出的“选择文件”对话框选择要跳转的文件,单击“确定”按钮。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/a99a494afa32939cc0e34a015719ce2c5a1b15a8.jpg)
直接跳转菜单:
1、 在“插入跳转菜单”对话框中不要勾选“菜单之后插入前往按钮”。将来网页跳转菜单中的菜单项只要单击就能跳转。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/f59dbe39131fceec25cdfcc679c4ec9958430ba8.jpg)
2、 现在单击“确定”按钮,跳转菜单就制作好了,在浏览器中就可以见到效果。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/58021a0148fe1e42a37f9162c2299a88381303a8.jpg)
前往跳转菜单:
1、 在“插入跳转菜单”对话框中勾选“菜单之后插入前往按钮”。将来网页跳转菜单中的菜单项选定后再单击“前往”按钮就能跳转。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/3852f6e5eceeadbcb83ad2c3cd18dfdae53b7ba8.jpg)
2、 现在单击“确定”按钮,跳转菜单就制作好了,在浏览器中就可以见到效果。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/e57a258602214f579d43c608732064fb970b73a8.jpg)
附加注意事项:
1、 1.在“插入跳转菜单”对话框最下面有个“更改URL后选择第一个项楫默礤鲼目”,如果勾选了它,则在跳转后会回到初始状态;不勾选它,则在跳转后不回到初始状态。
![Dreamwavear技巧:[5]创建网页跳转菜单](https://exp-picture.cdn.bcebos.com/05e24be983aee8d7403f765c6b781431deb666a8.jpg)
2、 2.如果要再加入菜单项,只要在第一个菜单的后面单击“回车”,杰克换行。