《网页设计(Dreamweaver)》上机练习

《网页设计（Dreamweaver）》上机练习

一、在监考教师指定的E盘创建一个个人文件夹，名字为学号-姓名的全部拼音。要求：学号使用考生的完整学号，如某考生的学号为070106001，姓名为“张红”，则文件夹的名称应为“070106001- zhanghong”。将网页设计所需素材复制到此文件夹中。以此文件夹为站点根文件夹，以个人姓名（如“张红”）为站点名称，创建站点。

二、按下面的要求创建站点内容、设计网页。

1. 站点【主页】内容如图1所示。页面背景颜色、文本字体颜色等格式可以自定。

要求：“欢迎浏览我们的网站—考生的真实学号与姓名”是滚动字幕，导航区有4个链接点（或Flash按钮）分别链接到4个相关页面；“制作人”文本右边为考生的真实学号与姓名，并做Email链接。左上方的图片如图2所示为自动交换图像。

图1 【主页】内容

图2 【主页】中的自动交换图像

2.【主页】中“地理位置”所链接的页面背景颜色与主页相同，其它格式自定。

3.【主页】中“旅游线路”所链接的页面如图3所示，背景颜色与主页相同，其它格式自定。

图3 【旅游线路】网页

4.【主页】中“观光景点”所链接的页面采用上下框架结构，页面背景颜色与主页相同，如图4所示。

（1）在页面上部框架，文本“考生学号－姓名”从左向右沿曲线运动。

图4 【观光景点】网页

（2）框架上部左上角的图片如图5与图6所示为鼠标经过图像。

图5图6

右上角的图片链接到站点的主页文件，在新窗口打开，并且有替代文本“返回主页”。

（3）当鼠标单击框架下部图片时，图片上的文本增加背景色，颜色自定。

（4）单击框架上部三个链接点“月亮湾”、“观鱼亭”、“变色湖”，其所链接的页面分别显示在框架下部，如图7所示。

图7 月亮弯观鱼亭变色湖

5. 【主页】中“生活提示”所链接的页面如图8所示，页面背景颜色与主页相同，其它格式可以自定。要求：水平线下面的6个链接点分别链接到同一页中的6个锚点。页面左上角的图片链接到站点的主页文件，并且有替代文本“返回主页”。

图8 【生活提示】网页

6．新建名为mycss1的CSS样式表，在其中重定义标签body，并将该样式表应用于创建的所有网页，样式表的要求如下：

页面背景颜色为#FFCC99，文本字体为隶书，大小14px

7．新建名为mycss2的CSS样式表，并将该样式表应用于“生活提示”网页，样式表的要求如下：

当链接未被点击时（link）：文字无下划线、大小为12px、颜色为#0000FF；

当鼠标移动到链接上时（hover）：文字有下划线，大小为14px、颜色为#FF3300；

当点击链接后（active）：文字无下划线，大小为12px、颜色为#FF66FF。