怎样用dreamweaver制作网站下拉菜单
更新时间:2023-08-12 15:44:01 阅读量: 初中教育 文档下载
一、使用Dreamweaver CS5制作下拉菜单
1. 在“插入”面板中点击“绘制 AP Div”按钮插入一个AP Div。请阅读Dreamweaver CS5插入AP Div。
2. 选择刚才插入的AP Div。请阅读Dreamweaver CS5激活、选择和删除AP Div。
3. 在AP Div属性面板上,设置AP Div的参数。如下图所示:
请阅读Dreamweaver CS5中AP Div属性面板。
4. 在AP Div内单击,将光标放在AP Div内,然后插入一个一行四列的表格,如下图所示:
请阅读Dreamweaver CS5插入表格。
(1)按住Ctrl键的同时点击表格的四个单元格,设置它们的宽度都为120。请阅读Dreamweaver CS5改变单元格的高度和宽度。
(2)在单元格中分别输入主菜单名称,然后加上链接。请阅读Dreamweaver CS5创建超链接。如下图所示:
如果AP Div与表格的设置不一致,可以分别调整AP Div或者表格。
5. 重复1.2.3.的步骤再次插入一个AP Div,然后设置AP Div的参数。如下图所示:
注意:
“左”和“上”两个参数是设置这个AP Div距离窗口左边框和上边框的距离的,如果填写的不正确,会导致子菜单的错位和以后的可用性。
6. 在apDiv2中输入下拉菜单的内容,在此仍用表格进行排版。如下图所示:
7. 为“网络编程”再制作一个AP Div,仍然重复1.2.3.的步骤插入一个AP Div,然后设置AP Div的参数。如下图所示:
8. 在apDiv3中输入下拉菜单的内容,仍然使用表格排版。因为表格排版比较方便,当然也可以使用其它方法。如下图所示:
9. 在“窗口”菜单中选择“AP 元素”命令,打开“AP 元素”面板。如下图所示:
点击“apDiv2”和“apDiv3”前面的方格,出现了闭着的眼睛图标。这时“apDiv2”和“apDiv3”被隐藏了起来。当我们打开网页时,这两个下拉菜单中隐藏起来的。
二、给菜单添加JavaScript行为
1.
为“网页制作”添加JavaScript行为。在“窗口”菜单中选择
“行为”命令,打开行为面板。点击“网页制作”所在的
标签,在行为面板中点击“十”按钮,在弹出的子菜单中选择“显示-隐藏元素”项,如下图所示:
2. 打开“显示-隐藏元素”对话框,如下图所示:
在“元素”项中设置“div "apDiv2"”为“显示”。这是“网页制作”的下拉菜单。
3. 点击“确定”按钮返回到行为面板,将“onClick”修改为“onMouseOver”,如下图所示:
“onMouseOver”的作用是当鼠标移动到第一个单元格“网页制作”时,下拉选单apDiv2会变为显示状态。
4. 在行为面板中继续点击“十”按钮,在弹出的子菜单中选择“显示-隐藏元素”项,打开“显示-隐藏元素”对话框,如下图所示:
设置“div "apDiv2"”为“隐藏”。
5. 点击“确定”按钮返回到行为面板,将“onFocus”修改为“onMouseOut”,如下图所示:
上面是将鼠标移动到或者移出“网页制作”菜单时,是否显示或隐藏子菜单。下面设置将鼠标移动到或者移出“网页制作”的子菜单时,是否显示或隐藏该子菜单。
6. 选择“apDiv2”,请阅读Dreamweaver CS5激活、选择和删除AP Div。
7. 在行为面板中点击“十”按钮,在弹出的子菜单中选择“显示-隐藏元素”项,如下图所示:
8. 重复“二、2.3.4.5.”的步骤将鼠标移动到或者移出“网页制作”的子菜单时,是否显示或隐藏该子菜单。设置好以后如下图所示:
9. 重复上面的部分,设置“网络编程”的子菜单(div "apDiv3")是否显示或隐藏。
查看代码效果:Dreamweaver CS5制作下拉菜单示例
正在阅读:
关于开放二胎政策的思考01-29
用友T3标准板 - 操作实训资料105-23
磁场物理量、磁路及其基本定律112-08
园林绿化工程竣工验收报告(建设单位)范本07-27
幼儿园家长委员会成员情况登记表03-29
高中物理竞赛 稳恒电流09-23
第二章流体输送机械习题10-24
八年级英语上册 Unit 10 If you go to the party, youll have a04-19
java复习题带答案04-19
- 二甲基甲酰胺安全技术说明书
- 南邮计算机网络复习题
- 高分子物理实验指导书 - 图文
- 2009.9.25 莞惠环控专业施工图设计技术要求
- 学生工作简报
- 揭阳市斯瑞尔环境科技有限公司废酸综合利用项目可行性研究报告-广州中撰咨询
- 今日靓汤(佘自强)
- 奥数 - 二年级 - 数学 - 第三讲时间的教师版计算答案 - 图文
- 如何命制一份好的物理试卷
- 数据库开题报告
- 禁用未经批准或已经废止或淘汰技术的制度流程
- 大学英语(二)第2阶段测试题
- 湘教版一年级上册美术教案(全)
- (整套)学生顶岗(毕业)实习手册
- 高频 二极管包络检波 - 图文
- 2018届中考英语复习题型四任务型完形填空备考精编含解析 - 186
- 郑煤集团超化煤矿一采区开采设计 - 图文
- 财政学习题
- 摄影摄像复习资料
- SMC D-A93接线方式 - 图文
- 下拉
- 制作网站
- dreamweaver
- 菜单
- 怎样
- 2014届高三政治生活第六课第三框第一轮复习
- 106,一年级下册语文第六单元试卷1
- Is the Lei Feng Spirit out of Date
- 决策支持系统复习参考题与解答答案
- 中国教育史脉络图
- 奶酪吐司(面包机版)
- 四年级下学期班级工作计划(标准版)
- 2020年中考物理试题专项训练——专题五十二:动态电路
- 天车.游车.大钩.转盘培训
- 学生信息管理系统详细设计说明书
- 2021年一级建造师工程经济第一章第五节考点必做练习题
- 棉绒加工及物流项目征地可行性报告
- 项脊轩志教学文档
- 地理读图练习题
- 2015三严三实和忠诚干净担当心得体会最新版
- 绩效考核结果如何系统运用
- 控件工具箱数值调节表
- 会务服务保障方案最新
- 北师大版二年级语文下册第一次月考试卷
- 云数据中心虚拟资源管理研究综述