文档介绍：实验显示弹出式菜单
实验要求
使用“显示弹出式菜单”行为来创建或编辑Dreamweaver弹出式菜单,或者打开并修改已插入Dreamweaver文档的Fireworks弹出式菜单。通过实验,掌握如何通过在“显示弹出式菜单”对话框中设置选项来创建水平或垂直弹出菜单,并使用此对话框来设置或修改弹出菜单,并使用此对话框来设置或修改弹出菜单的颜色、文本和位置。
说明若要察看文档中的弹出菜单,必须在浏览器窗口中打开该文档,然后将鼠标指针滑过触发图像或链接。
对应知识点:
行为面板的使用
设置行为事件
创建并编辑“显示弹出式菜单”行为
对应《Macromedia Dreamweaver MX 2004标准教程》第13章的内容。
实验课时:2课时
实验素材
无
实验步骤
启动 Dreamweaver MX 2004程序,新建HTML网页。保存网页为“”。
单击属性面板的“页面属性”按钮,在“属性面板”对话框中设置大小为“12像素”,webenyanse 为“白色(色标值为#FFFFFF)”。设置“链接颜色”和“已访问链接”为“白色”,“变换图像链接”为“黄色(色标值为#FFFF00)”,在“下划线样式”下拉列表中选择“金在变换图像时显示下划线”选项。在“标题”编辑框内输入网页标题“东方联网”,选择“简体中文”编码。
在空白网页中插入1行1列,宽度为172像素,其他项为0的表格。选中表格,在属性面板中设置“高”为“50像素”。
在单元格内输入文字“东方网联”,选中文字,在属性面板中设置字体为“黑体”,大小为“30像素“,颜色为“白色”,背景颜色为“暗红色(色标值为#993366)”,单击“居中对齐”按钮,完成后效果如图19-1所示。
在标题表格下方插入1行1列,宽度为172像素,单元格边距为6表格。选中表格,在属性面板中设置其背景颜色为“浅灰色(色标值为#EAEAEA)”。
在单元格内插入7行1列,宽度为160像素,单元格间距为2的嵌套表格。拖动鼠标选中7个单元格,在属性面板中设置高俄日“20”,背景色为“暗红色(色标值为#993366)”,并单击“居中对齐”按钮,效果如图19-2所示。
图19-1 设置标题效果图19-2 列表效果
在每行单元格内输入“栏目标题”,如网站推荐、新闻动态、购物天地、分类信息等等。如图19-3所示。
选中“网站推荐”标题文字,在属性面板“链接”编辑框内输入“# ”。选择菜单“窗口”----〉“行为”命令,打开行为面板。单击行为面板的“+”按钮,在菜单中选择“显示弹出式菜单”选项。如图19-4所示。
图19-3 单元格内输入栏目题图19-4 无址链接并行为面板的“显示弹出式菜单”
打开“显示弹出式菜单”对话框。在“文本”编辑框内输入“搜索引擎”,单击“+”按钮,“搜索引擎”项被添加到“文本”列表中。
在“文本”编辑框内输入“百度”替换“新建项目”文字,选择“目标”下拉列表中的“_blank”选项,在“链接”编辑框内输入““。如图19-5所示。
说明在出现的“显示弹出菜单”对话框中,使用以下标签来设置弹出菜单的选项:“内容”允许你单独设置个菜单项的名称、结构、URL和目标。“外观”使你能够设置菜单“一般状态”和“滑过状态”的外观以及设置菜单项