1、网页设计与制作上机试卷（一） 操作题一： 1、建立并设置本地根文件夹: 新建本地根文件夹:在考生文件夹中新建本地根文件夹，命名为root，并在该文件夹中新建Xl-01文件夹。 复制文件:将DWMXUnitlYl-0lYl-Ol.jpg文件复制到Xl-01文件夹中。 2、定义站点: 设置 站点名称:定义DreamweaverMX站点，命名为 我的站点。 设置本地根文件夹:本地根文件夹指定为考生文件夹中的root文件夹。 设置 HTTP地址:HTTP地址设置为localhost。 将设置好的定义站点对话框的高级选项卡分类栏中本地信息列表项拷屏，以Xi-OlA.bmp 文件名保存在Xl-01文件夹中
2、。 3、创建与设置文档: 创建文档:启动Dreamweaver MX，新建一个未命名的HTML文档。 命名和保存文档:文档命名为Xl-0l.html，并将其保存到考生文件夹申的rootXl-01文件夹中。 设置文档页面属性:将Xl-0l.htm文档的标题设置为黄河一我的母亲;背景图像设置为Xl-0lYl-0l.jpg 图像;左边界、边界宽带、顶部边界以及边界高度分别设置为20。 将设置好的页面属性对话框拷屏，以Xl-OlB.bmp文件名保存在Xl-01文件夹中。 4、输入文本:在Xl-0l.htm文档中输入样图1-OlA中的文本。 5、创建与运用HTML样式: 创建HTML样式:创建样式名为H
3、TMl-0l的HTML样式。具体设置为段落样式，应用该样式时清除已有的样式 格式;设置字体为隶书，粗体，大小为6号字，颜色为#66FF33，格式为 标题1，对齐方式为居中对齐。 运用HTML样式:对所输入文本的标题 黄河一我的母亲运用HTMl-01样式。 6、使用CSS样式表: 创建CSS样式:在Xl-0l.htm文档中创建CSS样式，以cssl-0l为CSS样式名保存到Xl-01文件夹中。 设置字体为隶书，字号为16点数，颜色为#eC66FF。左对齐，带下划线，首行缩进20点数。 使用CSS样式:对所输入文本的第2段运用cssl-O1样式，运用样式的效果如样图1-01B所示。 将操件结果保存
4、在Xl-01文件夹中。 操作题二： 1、布局页面: 绘制页面布局:新建一个文档，以X2-OlA.htm为文件名保存到X2-01文件夹中。参照样图2-OlA在X2-OlA.html 文档中绘制页面布局。 设置页面布局:参照样图2-01A的标注，顶端布局单元格的宽度为700像素，高度为73像素，背景颜色 为#FFCCFF;左侧布局表格的宽度为100像素，高度为403像素，背景颜色为#FFCCCC;右侧布局表格的宽度 为600像素，高度为403像素，背景颜色为#FFCC99。 2、表格的创建与设置： 创建表格:新建一个文档，以X2-OlB.htm为文件名保存到Y2-01文件夹中。参照样图2-OlB在
5、X2-0l.htm文 档中创建一个表格。 设置表格:表格的宽度为412像素，单元格填充和单元格间距设置为0，表格的边框设置为1，表格命名为 T2-OlA。填充表格:输入样图2-OlB中的表格数据及文字。 3、设置单元格属性: 表格水平居中对齐;除第1行单元格外，其余各列单元格的宽度为80像素，度均为25像素。使用格式化表格 命令。设置行颜色，奇数行颜色为#FFFFCC，偶数行颜色为#CCFFgg。表格第1行的对齐方式为居中，文本样 式为粗体，背景颜色为#6633CC,文本颜色为白色。表格的第1列对齐方式为居中对齐，文本样式为斜体。表 格的边框为1。 4、复制表格或单元格:复制T2-OlA的第2
6、行第6行，粘贴到表格T2-OlA的下面，命名为T2-01B。 5、管理表格:按T2-OlB第2列的升序排序T2-OlB，如样图2-OlC所示。 6、重新编排表格:复制表格T2-OlB，重命名为T2-OlC。交换T2-OlC中销售部与“开发部”两列，如样图 2-01D所示。将操作结果保存到X2-01文件夹中。 操作题三： 1、运用图像:打开X3-0lA.htm文档，在该文档中插入X3-01imagesY3-0l.jpg图像。 2、设置图像属性: 设置图像高为300像素，宽为400像素，纵向和横向间隙为100像素，图像在文档窗口中居中。 绘制图像热点区域，参照样图3-01创建图像热点区域。头部采用
7、圆形热点工具;背部采用矩形热点工具; 翅膀和尾部采用多边形热点工具。头部热点区域替代文本为学习头部的制作;背部热点区域替代文本学 习背部的制作;翅膀处热点区域替代文本为学习翅膀的制作;尾部热点区域替代文本为学习尾部的制作。 3、设置图像链接:分别为头部、背部、翅膀和尾部热点区域创建链接，均链接到X3-01X3-OlB.htm文档，链 接文档在-blank目标中打开。 4、电子相册的创建:打开一新文档窗口，创建相册图。设置主标题为相册集，副标题为风景篇，其他信 息为祖国大好河山欣赏。源文件夹指定为DWMXUnit3Y3-0lpic文件夹，目的文件夹指定为X3-01文件夹。 缩小尺寸为1OOxlO
8、0，每行显示5列，缩小格式及图片格式分别为JPEG-BeHerQual时，图像的显示比例为100， 创建图像导航。将X3-0lindex.htm文档重命名为X3-0lB.htm，按提示更新链接。 将操作结果保存到X3-01文件夹中。 操作题四： 1、框架的插入:打开一个空白文档，在该文档中创建一个框架。 2、框架的命名:将左边的框架命名为IndeX，顶部框架命名为Top，右边框架命名content. 3、保存框架集文件:将框架集文件命名为X4-0lA.htm，保存到X4-01文件夹中. 4、填充框架内容:参照样图4-01在Index框架中输入目录和各首唐诗的名称;文本格式为段落， 幼园，4号，
9、颜色为白色。文本格式为段落，隶书，5号，颜色为白色，Top框架作为标题栏输入文 本唐诗欣赏，文本格式为段落，隶书，5号，颜色为白色. 5、插入代码片断:参照样图4-01在Top框架第2行单元格中插入代码片断。面板中Snippets x4-0l.csn代码片断。 6、保存与设置框架文档:保存框架到X4-01文件夹，其中Top框架保存为X4-0lB.htm文档;Index框架 保存为X4-0lC.htm;Content框架保存为X4-0lD.htm。设置X4-0lB.htm文档和X4-01C4.htm文档的背景 颜色为#999999。 7、超级链接的建立与框架目标的指定:创建左边Index框架中文
10、本与WJYY4-0lAthtm文件链 接;文本与WJY4-0lB.htm文件链接;文本月下独酌)与WJY40lC.htm 文件链接;文本与WJY4-0lD.htm文件链接;文本与WjY4-0lE.htm文件链接;文本” 与WJY4-0lF.htm文件链接;文本与WjY4-0lG.htm文件链接。每首诗的正文均在 Content框架中显示。 8、框架源文件的指定:设置Content框架中的源文件，源文件设置为WjY4-0lA文档。将操作结果保存在 X4-01文件夹中。 操作题五： 1、创建和设置链接:在文档中的DreamweaverUluaDev教程图像处创建与X5-01.HTM的链接。 2、插
11、入命名书签:在X5-0l.htm文档右栏内容区中，在文本一、内容简介二、准备工作、 三、Web应用示例和四、拷贝文件的左边分别插入命名书书签的命名依次为X5-OlA,X5-OlD。 3、创建命名书签链接:分别创建左栏文本一、内容简介与右栏命名书签一、容简介处的链接; 左栏文本二、准备工作与右栏命名书签二、准备工作处接;左栏文本三、Web应用示例与右 栏命名书签三、Web应用示例处的链接;左栏文本四、拷贝文件与右栏命名书签四、拷贝文件 处的链接。 、 4、链接的设置与更改:创建右栏中所有文本返回目录与左栏命名书签教程，目录处链接，要求 教程目录命名书签的名称为x5-01e，和教程目录的链接，删除
12、原返回目录文本中的空链接。 5、创建电子邮件链接:在教程目录栏目下的文本联系我们中创建电子邮接，电子邮件地址为 guest。 将操作结果保存到X5-01文件夹中。 操作题六： 1、 层的插入及命名:在该文档申分别插入三个没有包含关系的层，依次命名为Layer1、Layer2和Layer3。 2、 层内插入图像:将X6-0lhimagesY6-0lA.jpg图像插入到Layerl中，Y6-0lB.jPg像插入到Laye1中， Y6-0lC.jpg图像插入到Layer3中。设置层的大小和坐标. 3、 调整层和层内图片的大小，使它们的大小保持一致，宽度为400，高度为300,单位为像素。设置层在 页
13、面中的坐标，X为226，Y为61. 4、 时间轴和行为的使用:参照样图6-01完成时间轴和行为的使用。 5、 设置时间轴:将Layerl图层加到第1条动画轨道第1-5帧中;将Layer2图层加到第2条动画轨道的第5-10 帧中;将Layer3图层加到第3条通道的第10-15帧中。 6、 添加行为:在第1帧处加入显示Layerl、同时隐藏其他层的行为;在踊处加入显示Layer2、同时隐藏其他 层的行为;在第10帧处加入显示Layer3,同时隐藏其他层的行为;在第15帧处隐藏Layer3的行为。 7、 设置循环和自动播放:将动画设置为循环并自动播放，拖动最后1帧频道上的小方块与15帧处行为频道 上
14、的行为重合。 将操作结果保存到x6-01文件夹中。 操作题七： 1、 插入并命名表单:在X7-0l.htm文档中插入一个命名为LoginFom的表单。 2、 插入表单对象:参照(样图7-01完成调查表单的布局、文本的输入和表单对象的插入操作。 3、 表单对象属性的设置:将 姓名:右边的文本域命名为name，字符宽度为10，最多字符数为16, 类型为单行文本域。 将 性别:右边两个单选按钮均命名为gender，取值依次为0、1，初始状态均未被选中。 将 EmaiI:右边的文本域命名为email，字符宽度为30,最多字符数为20,类型为单行文本域。 将 平均每天上网:右边文本域命名为hour，类型
15、为菜单类型。列表的选项为1-2小时、3-5小时、5-10 小时、10小时以上，列表的值依次为01-04，初始选项为1-2小时。 将 经常上的网站:右边的复选框从左到右命名依次为netlnet3，初始状态均为未选中状态取值依次 为01-03。 将 对现在网站的建议:右边文本框命名为jianyi，类型为多行文本域，字符宽度为50，字符行数为5。 4、 插入表单按钮:将左边按钮命名为Submitl ，右边按钮命名为Submit2,设置按钮:左边按钮标签为 提交，右边按钮标签为 重填;左边按钮动作为提交表单，右边按钮动作为重置表单。 5、 表单的属性设置:设置表单LoginForm动作为Login.a
16、sp表单处理程序，方法为发送请求。 将操作结果保存到X7-01文件夹中。 操作题八： 设置页面属性打开X8-11.htm 文档,标题设置为文化教育首页_新浪网. 1. 创建CSS样式 重定义HTML标记:分别将Boby和Td标记的字体设置为宋体9磅,仅在当前文档中使用 定义样式文件:定义名称为CSS8-11.CSS超链接样式文件,保存在X8-11文件夹中,光标移到链接时的 颜色设置为#FF0000,超链接的正常状态颜色设置为#33FF33,访问过的超链接颜色设置为#993366。 2. 局页面轮廓:参照样图8-11A完成样图8-11B中所标注的各个区域的制作. 布局(1)区页面轮廓:按样图8-
17、11A中标注的(1)区参照样图8-11B用2行10列,1行3列和1行2列的表格 布局页面轮廓； 布局(2),(3)和(4)区页面轮廓:按样图8-11A中标注的(2),(3)和(4)区,参照样图8-11B用2行3列表格； 布局(2),(3)和(4)区页面轮廓.在一列单元格中布局样图8-11A中标注的(2)区,第1行第1列单元格 中插入ed02.gif图像,在该单元格中使用edbg02.gif为背景图,第2行第1列单元格中嵌套一个12和 4列的表格用于布局样图8-11A中标注的(2)区的下半部部分轮廓.在第3列单元格中嵌套一个12行2列 的表格布局样图8-11A中标注的(3)区页面轮廓.在(3)区
18、的下面布局样图8-11A中标注的(4)区页面轮廓. 布局(5)区页面轮廓:用4行1列的表格来布局(5)区页面轮廓. 通过对上述各布局表格中单元格的拆分或合并,布局页面轮廓. 3. 填充页面元素: 创建(样图8-11A中标注的(1)区:第1行第1列单元格背景颜色设置为#FFC800从上到下可用2行10列, 1行3我和1行2列的表格来完成,在1行2列表格的第2列元格中插入一个背景颜色为#666666,1行21 列的表格来完成,在1行2列表格的从上以下3个表格高度分别为28,60和34,宽度为750,单位均为像素. 文化教育导航中各文本之间用图像间隔图像的W,H为14和21,文本,首页所在单元格背景
19、颜色为#CCCCFF. 创建(样图8-11A中标注的(2)区:将第2行单元格背景颜色设置为#CCCCFF,分别插入水平线和1行3列的表格, 在表格的第1无单元格中插入ed03.gif图像,第3列单元格中插入ed04.gif,在表格的下面插入12行4列的表格 分别在第1和4列单元格中插入edbg04.gif图像,在第12行单元格中插入edbg08.gif图像.创建该区时,根据需 要对相应的单元格进行合并和设置其宽度和高度,注意表格边界的修饰图和背景图像的利用. 创建(样图8-11A中标注的(3)区:文本文教信息文本为宋体,3号字,粗体,该区背景颜色为#FCFBE3. 创建(样图8-12A中标注的(4)区:设置区域背景颜色值为#FCFBE3,表单名称为SOusuo,方法为Post 动作为 Search.asp文本载的命名为textfield.字符宽度和最多字符数分别为16,80类型为单行文本域,下拉列表框 的命名为select,类型为菜单,列表值为网站,网页,软件.游戏和新闻,按钮的命名为Submit标签为搜索,动作 为提交表单. 创建(样图8-11A中标注的(5)区参照样图8-11B完成版权区的创建,输入版权区的文本和竖线. 4. 将操作结果保存到X8-11文件夹中
