网页制作操作题.docx
《网页制作操作题.docx》由会员分享，可在线阅读，更多相关《网页制作操作题.docx（16页珍藏版）》请在冰豆网上搜索。
网页制作操作题
网页制作
第1套
打开c:
\ks文件夹中的wy站点，并按下列要求在站点中建立和修改网页。
1.打开主页index.htm，在网页中插入一个2行2列的表格，按样张在表格第1行插入两张图片（图片文件名为bar11.gif、bar12.gif）。
2.在第2行左起第1列的单元格插入一段Javascript代码（代码在文件date1.txt中，插在HTML文本响应位置中），以显示计算机的当前日期。
3.将表格第2行第2列拆分成3列，按样张在这3个单元格中加入三个超级链接，即：
“主页”与index.htm相链接，“表单”与fj.jpg相链接，“电子邮件”与电子邮件地址sh@相链接，三个超链接的目标框架均为“新建窗口”。
4.按样张在网页中，再插入一个2行2列的表格，在第1行第1列中存放test1.txt文件中第1、第2小节的内容，正常显示时，第1行第2列内时的图像为“tp11.jpg”，当鼠标移入时图像变为“tp21.jpg”，鼠标移开后，恢复正常。
按样张对表格第2行的第1列、第2列进行合并，存放test1.txt文件中第3小节的内容，双倍行距。
5.按样张在网页底部插入版权信息：
桂林山水©2006，在网页中插入背景音乐“yaolan.mid”。
注意：
由于显示器分辨率或窗口大小的不同，网页中文字的位置可能与样张略有差异，图文混排效果与样张大致相同。
【网页样张】
参考解答
1.启动Dreamweaver，打开站点c:
\ks\wy，打开c:
\ks\wy\index.htm，选择“插入︱表格︱行数：
2，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中”，分别单击表格第1行第1列和第2列，选择“插入︱图像”，插入bar11.gif和bar12.gif。
分别单击表格各单元，在属性工具栏“背景颜色”中输入“#00FF66”。
2.打开c:
\ks\wy\data1.txt，鼠标拖曳选中script内的特效程序，按+复制，单击表格第2行第1列，选择“插入/HTML︱脚本对象︱脚本”，光标停在内容框内，+复制，单击“确定”。
3.单击表格第2行第2列，在属性面板中，单击拆分单元格“
”工具，拆分成3列，分别输入“主页”、“表单”与“电子邮件”，在属性面板上，分别输入三个超级链接，index.htm、fj.jpg、mailto:
sh@，再分别选“目标：
_blank”。
4.光标停在第1个表格的尾部，选择“插入︱表格︱行数：
2，列数：
2，宽：
75百分比，边框粗细：
0”，单击“确定”，属性面板选“对齐：
居中”，光标定位在第1行第1列，粘贴存放test1.txt文件中第1、第2小节的内容，单击第1行第2列，选择“插入︱图像对象︱鼠标经过图像，原始图像：
tp11.jpg、鼠标经过图像：
tp21.jpg”，单击“确定”，选中表格第2行的第1列和第2列，单击属性面板的合并所选单元格“
”工具，粘贴存放test1.txt文件中第3小节的内容，鼠标拖曳选中第3小节，选择“文本︱CSS样式︱新建”，弹出“新建CSS规则”窗口，进行名为yp的CSS样式的定义。
5.光标停在网页底部，输入“桂林山水2006”，光标停在文字中间，选择“插入/HTML︱特殊字符︱版权”，单击“常用”工具栏中的“flash”按钮
，选择文件“yaolan.mid”，单击“确定”按钮。
分析：
用这种方法插入的音频不使用插件播放，其播放的方式是事先设置好的，所以在浏览网页时，用户不能控制音乐的播放。
如要在网页中看到播放器，控制音乐的播放与停止，可选择“插入︱媒体︱插件”，在页面上还可对插件大小进行调整。
6.按样张调整主页（首行缩进、单元格大小，对齐方式，对象位置、间距、颜色等），选择“文件︱保存”。
第2套
打开c:
\ks文件夹中的wy站点，并按下列要求在站点中建立和修改网页。
1.该网页中建立一个横幅与目录样式的框架组织网页，框架网页文件名为index.htm，替代原来的index.htm主页。
上、左、右框架内的网页文件名分别为top.htm，left.htm和right.htm，各框架的大小与样张基本相同即可，并使框架边框不显示。
2.按样张在top.htm网页顶端插入二张图片，图片文件名为bar21.gif、bar22.gif。
3.按样张在left.htm中插入一个3行1列的表格，每行的单元格插入三个Flash按钮，“主页”与index.htm链接，目标框架为“整页”；“查询”与tp11.jpg相链接，目标框架为“新建窗口”；“电子邮件”与电子邮件信箱链接，邮件地址为：
“sh@”。
4.在right.htm网页中，插入一个2行2列的表格，表格的第2行合并成1列，并按样张在表格各单元中存放test2.txt文本中相应的内容和图片（图片文件tp21.jpg），在该图片上添加文字“散步”。
5.在right.htm网页的最后一行，通过在HTML文本中插入一段Javascipt代码，Javascript代码在文件wellcome.txt中。
注意：
由于显示器分辨率或窗口大小的不同，网页中文字的位置可能与样张略有差异，图文混排效果与样张大致相同。
【网页样张】
参考解答
1.启动Dreamweaver，打开站点c:
\ks\wy，打开c:
\ks\wy\index.htm，选择“布局”面板中的“框架”按钮，并选择框架的布局结构，文档窗口中便按框架布局出现了分割线。
将光标定位在上框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名top.htm，并单击“保存”按钮，将光标定位在左框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名left.htm，并单击“保存”按钮，将光标定位在右框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名right.htm，并单击“保存”按钮。
2.光标定位在上框架，选择“插入︱表格︱行数：
1，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，光标分别定位在第1行第1列和第1行第2列，选择“插入︱图像”，插入bar21.gif和bar22.gif。
3.光标定位在左框架，选择“插入︱表格︱行数：
3，列数：
1，宽：
50百分比，边框粗细：
0，单元格间距为2”，单击“确定”，属性面板选“对齐：
右对齐”。
光标停在第1行，选择“插入︱媒体︱Flash按钮”，出现“插入Flash按钮”对话框时，输入按钮文本“主页”，链接：
“index.htm”，目标：
“_self”，背景色：
#0000FF，另存为：
button1.swf，单击“确定”，光标停在第2行，选择“插入︱媒体︱Flash按钮”，出现“插入Flash按钮”对话框时，输入按钮文本“查询”，链接：
“tp11.Jpg”，目标：
“_blank”，背景色：
#0000FF，另存为：
button2.swf，单击“确定”，光标停在第3行，选择“插入︱媒体︱Flash按钮”，出现“插入Flash按钮”对话框时，输入按钮文本“电子邮件”，链接：
“mailto：
sh@”，背景色：
#0000FF，另存为：
button3.swf，单击“确定”。
4.光标定位在右框架，“插入︱表格︱行数：
2，列数：
2，宽：
80百分比，边框粗细：
0，单元格间距为2”，单击“确定”，属性面板选“对齐：
左对齐”。
光标选中第2行，在属性面板中，单击“合并”按钮。
光标定为在第1行第1列，选择“插入︱图像：
tp21.jpg、替换文本：
散步”，单击“确定”，光标定位在第1行第2列，存放test2.txt文本中相应的内容，光标定位在第2行，存放test2.txt文本中相应的内容。
5.打开c:
\ks\wy\wellcome.txt，鼠标拖曳选中script内的特效程序，按+复制，光标拖曳选中右框架网页的最后一行，选择“插入/HTML︱脚本对象︱脚本”，光标停在内容框内，+复制，单击“确定”。
6.按样张调整主页（首行缩进、单元格大小、框架位置、对齐方式，对象位置、间距、颜色等），选择“文件︱保存全部”，将此页面保存在c:
\ks中，取名为“index.htm”。
第3套
打开c:
\ks文件夹中的wy站点，并按下列要求在站点中建立和修改网页。
1.打开主页index.htm，按样张在网页顶端插入一张图片，图片文件名为bar31.gif，并在bar31.gif上定义一个书签，书签名为xxx。
在图片下，插入水平线、设置其高度为3个像素，颜色为#FFFF00。
2.按样张在顶端图片下插入一个1行3列的居中表格，3个单元格中分别如样张建立三个Flash按钮，其中“主页”与index.htm链接，“查询”与tp11.jpg相链接，“电子邮件”与电子邮件地址sh@相链接。
3.插入一个2行2列的表格，按样张插入test3.txt文件的内容和图片tp31.jpg，设置图片的垂直边距为10像素，水平边距为20像素。
4.按样张在网页底部插入一个超级链接“top”，位置居中，与上面所定义的书签相链接。
5.在网页最下方插入字幕“欢迎光临xxx个人站点”，将其表现设置为：
交替。
注意：
由于显示器分辨率或窗口大小的不同，网页中文字的位置可能与样张略有差异，图文混排效果与样张大致相同。
【网页样张】
参考解答
1.启动Dreamweaver，打开站点c:
\ks\wy，打开c:
\ks\wy\index.htm，“插入︱图像：
bar31.gif”，单击“确定”，选中图片，选择“插入︱命名锚记：
xxx”，单击“确定”，光标定位在bar31.gif后，选择“插入︱HTML︱水平线”，选中水平线，鼠标右击，快捷菜单中选“编辑标签”，在标签编辑器中，“常规：
高度3”，“浏览器特定：
颜色#FFFF00”，单击“确定”。
2.光标定位在顶端图片尾端，按回车键，选择“插入︱表格︱行数：
1，列数：
3，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中”，光标停在第1行，选择“插入︱媒体︱Flash按钮”，出现“插入Flash按钮”对话框时，输入按钮文本“主页”，链接：
“index.htm”，目标：
“_self”，背景色：
#0000FF，另存为：
button1.swf，单击“确定”，光标停在第2行，选择“插入︱媒体︱Flash按钮”，出现“插入Flash按钮”对话框时，输入按钮文本“查询”，链接：
“tp11.Jpg”，目标：
“_blank”，背景色：
#0000FF，另存为：
button2.swf，单击“确定”，光标停在第3行，选择“插入︱媒体︱Flash按钮”，出现“插入Flash按钮”对话框时，输入按钮文本“电子邮件”，链接：
“mailto：
sh@”，背景色：
#0000FF，另存为：
button3.swf，单击“确定”。
3.光标定位在表格的尾端，按下回车键，选择“插入︱表格︱行数：
2，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中”，光标定位在第1行第1列，选择“插入︱图像：
tp31.jpg”，单击“确定”，在属性面板上设置：
图片的垂直边距为10像素，水平边距为20像素。
光标定位在第1行第2列，粘贴存放test1.txt文件中相应的内容，鼠标拖曳选中第2行，属性面板上单击“合并”工具栏，粘贴存放test1.txt文件中相应的内容，鼠标拖曳选中表格中的文字段落，单击属性面板中的项目“
”，设置默认的黑色实心项目，选择“文本︱CSS样式︱新建”，弹出“新建CSS规则”窗口，进行名为yp的CSS样式的定义，在属性面板中选择“yp”，便完成了项目符号的应用，黑色实心项目变为空心圆圈。
4.在网页底部输入“top”，鼠标拖曳选中“top”，在属性面板单击“居中对齐”按钮，链接输入：
#xxx。
5.选择“布局”工具栏，单击绘制层图标
，或选择“插入︱布局对象︱层”，在页面中拖曳生成一个名叫“Layer1”的层，调整“Layer1”层的位置，鼠标右击“Layer1”
，在快捷菜单项中单击添加到时间轴。
在“Layer1”中输入文字“欢迎光临xxx个人站点”。
鼠标单击时间轴中第1通道，第15帧，延长该帧至30帧，单击第15帧，鼠标右击，增加关键帧，按住层左上方的
，将“Layer1”水平由左拖曳到画面的右边，画面显示拖动轨迹，选中时间轴上的“自动播放”和“循环”选项，系统弹出警告框，单击“确定”。
6.按样张调整主页（首行缩进、单元格大小，对齐方式，对象位置、间距、颜色等），选择“文件︱保存”。
第4套
打开c:
\ks文件夹中的wy站点，并按下列要求在站点中建立和修改网页。
1.在该网站中建立一个水平拆分样式的框架组织网页，框架网页文件名index.htm，替代原来的index.htm主页。
上、下框架内的网页文件名分别为top.htm，bottom.htm，各框架的大小与样张基本相同即可，并使框架边框不显示。
2.按样张在top.htm网页顶端插入一张名为bar41.gif图片，在其右侧插入一个flash插件，其flash文件名为bar42.swf。
3.按样张在bottom.htm网页的左侧插入一个3行1列的表格，每单元格按样张插入文本并建立三个超级链接，“主页”与index.htm链接，目标框架为整页，“查询”与fj.jpg相链接，目标框架为整页，“电子邮件”与电子邮件地址sh@相链接。
4.通过设置，使已访问的超级链接的颜色、当前超级链接和超级链接的颜色均为绿色。
5.在bottom.htm网页中插入一个2行2列的表格，第2行合并为一列，按样张插入test4.txt文件的内容和图片，图片文件为tp41.gif，分别在该图片的左边部分和右边部分定义两个矩形热点，左边热点所对应的超链接为，右边热点所对应的超链接为。
注意：
由于显示器分辨率或窗口大小的不同，网页中文字的位置可能与样张略有差异，图文混排效果与样张大致相同。
【网页样张】
参考解答
1.启动Dreamweaver，打开站点c:
\ks\wy，打开c:
\ks\wy\index.htm，选择“布局”面板中的“框架”按钮，并选择框架的布局结构，文档窗口中便按框架布局出现了分割线。
将光标定位在上框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名top.htm，并单击“保存”按钮，将光标定位在下框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名bottom.htm，并单击“保存”按钮，单击框架边框，在属性面板上，选择“边框：
否，边框宽度：
0”。
2.光标定位在上框架，选择“插入︱表格︱行数：
1，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，光标定位在第1行第1列，在属性面版设置：
“宽：
25%，右对齐”，选择“插入︱图像”，插入bar41.gif，光标定位在第1行第2列，在属性面版设置：
“居中对齐”，选择“插入︱媒体：
Flash”，输入文件名：
bar42.swf，单击“确定”。
3.光标定位在下框架，选择“插入︱表格︱行数：
3，列数：
3，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，并调整为下图：
光标定位在第1行第1列，输入“主页”，在属性面板上设置“链接：
index.htm，目标：
_blank，对齐：
左对齐”，光标定位在第2行第1列，输入“查询”，在属性面板上设置“链接：
fj.jpg，目标：
_blank，对齐：
左对齐”，光标定位在第3行第1列，输入“电子邮件”，在属性面板上设置“链接：
mailto:
sh@，对齐：
左对齐”，光标拖曳选中第1列，属性面板设置“宽度：
15%”。
4.单击属性面板上的“网页属性”，在出现的“页面属性”对话框中选“链接”，设置“链接颜色：
绿色，已访问链接颜色：
绿色”，单击“确定”。
5.光标定位在第2列第1行，存放test4.txt文本中相应的内容，光标定位在第3列第1行，选择“插入︱图像”，插入tp41.gif。
单击属性面板矩形热点工具，分别在图片左边和右边画热区，分别选中左右热区，在属性面板上设置“链接：
，和”。
6.按样张调整主页（首行缩进、单元格大小、框架位置、对齐方式，对象位置、间距、颜色等），选择“文件︱保存全部”，将此页面保存在c:
\ks中，取名为“index.htm”。
第5套
打开c:
\ks文件夹中的wy站点，并按下列要求在站点中建立和修改网页。
1.在该网站中新建一个自顶向下的层次结构样式的框架组织网页，框架网页文件名为index.htm，替代原来的index.htm主页。
上、中、下框架的高度在框架网页的比例分别为25%、60%和15%，框架名分别为：
top.htm，main.htm，bottom.htm并使框架边框不显示。
2.按样张在top.htm网页左上角插入一张名为bar11.gif图片，在其右侧插入导航条，其状态图像为：
adv1.gif、鼠标经过图像为：
adv2.gif、按下图像为：
adv3.gif，替换文本：
横幅广告，单击bar11.gif，可试听声音文件“island.mid”。
3.按样张在top.htm中右下角插入一个1行3列的表格，如样张输入文字并设置三个超链接，“主页”与index.htm链接，目标框架为“整页”；“查询”与fp.jpg相链接，目标框架为“main”，“电子邮件”与电子邮件信箱链接，邮件地址为：
sh@。
4.在main.htm网页中插入两个1行2列的表格，按样张分别在各个单元格中插入test6.txt文件的内容和文件名为tp61.gif和tp62.gif图片，文字颜色为蓝绿色。
5.按样张在bottom.htm网页加入版本信息。
注意：
由于显示器分辨率或窗口大小的不同，网页中文字的位置可能与样张略有差异，图文混排效果与样张大致相同。
【网页样张】
参考解答
1.启动Dreamweaver，打开站点c:
\ks\wy，打开c:
\ks\wy\index.htm，选择“布局”面板中的“框架”按钮，并选择框架的布局结构，文档窗口中便按框架布局出现了分割线。
将光标定位在上框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名top.htm，并单击“保存”按钮，将光标定位在中框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名main.htm，并单击“保存”按钮，将光标定位在下框架内时，选择“文件︱框架另存为”命令，出现“保存为”对话框时，输入文件名bottom.htm，并单击“保存”按钮，单击框架边框，在属性面板上，选择“边框：
否，边框宽度：
0”，单击属性面板上的“上框架，行：
25百分比，中框架：
60百分比，下框架，15百分比”。
2.光标定位在上框架，选择“插入︱表格︱行数：
1，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，光标定位在第1行第1列，在属性面版设置：
“宽：
40%，左对齐”，选择“插入︱图像”，插入“bar11.gif”，选中图像，在行为面板设置添加行为：
播放声音。
声音文件为island.mid。
光标定位在第1行第2列，在属性面版设置：
“居中对齐”，选择“插入︱图像对象：
导航条”，在出现的导航条对话框中设置“状态图像：
adv1.gif、鼠标经过图像：
adv2.gif、按下图像：
adv3.gif，替换文本：
横幅广告”，单击“确定”。
提示：
选中bar11.gif，单击属性面板上的“链接”按钮，也可选择声音文件。
3.光标定位在上框架的右下角，选择“插入︱表格︱行数：
1，列数：
3，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，在表格各列中输入“主页”、“查询”、“电子邮件”，选中“主页”，在属性面板上设置“链接：
index.htm、目标：
_parent”，选中“查询”，在属性面板上设置“链接：
fp.jpg、目标：
_mainFrame”，选中“电子邮件”，在属性面板上设置“链接：
mailto:
sh@、目标：
_mainFrame”。
4.光标定位在中框架，选择“插入︱表格︱行数：
1，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，光标定位在第1行第1列，选择“插入︱图像：
tp61.gif”，单击“确定”，光标定位在第1行第2列，粘贴test6.txt文件的相应内容，鼠标拖曳选中表格内的文字，在属性面板设置“文本颜色：
蓝绿色”。
光标定位在表格的尾端，选择“插入︱表格︱行数：
1，列数：
2，宽：
75百分比，边框粗细：
0，单元格间距：
0”，单击“确定”，属性面板选“对齐：
居中对齐”，光标定位在第1行第1列，粘贴test6.txt文件的相应内容，光标定位在第1行第2列，选择“插入︱图像：
tp62.gif”，单击“确定”。
5.光标停在网页底部，输入“Copyright2000-2008xxx版权所有”，光标停在文字前端，选择“插入/HTML︱特殊字符︱版权”。
6.按样张调整主页（首行缩进、单元格大小、框架位置、对齐方式，对象位置、间距、颜色等），选择“文件︱保存全部”，将此页面保存在c:
\ks中，取名为“index.htm”。
第6套
打开c:
\ks文件夹中的wy站点，并按下列要求在站点中建立和修改网页。
1.按下列要求在该网站中新建文件名为form.htm的网页，网页背景色为#CCCCCC，插入表单，各表单域的信息如下表所示。
所表示信息
类型
名称
格式、有效性规则
选项按钮或下拉菜单中的值
姓名
文本框
name
宽度10
性别
两个单选项按钮
sex
male、female
文化程度
下拉菜单
degree
小学、中学、大学
2打开主页index.htm，按样张在网页顶端插入二张图片，图片文件名为bar71.gif、bar72.gif。
3.按样张在顶端图片下插入一个1行4列的表格，按样张在单元格中输入文字并设置超链接，“主页”与index.htm相链接，“注册”与form.htm相链接，“查询”与文件tp11.jpg相链接，“电子邮件”与电子邮件地址sh@相链接。
4.在网页中分别插入两个1行2列的表格，按样张插入test7.txt文件的内容和文件名为tp71.gif、tp72.gif的两张图片。
5.按样张在网页底部插入字幕“欢迎光临本站”。
注意：
由于显示器分辨率或窗口大小的不同，网页中文字的位置可能与样张略有差异，图文混排效果与样张大致相同。
【网页样张】
参考解答
1.启动Dreamweaver，打开站点c:
\ks\wy，执行菜单“文件︱新建︱常规基本页HTML︱创建”，单击属性面板“页面属性”，设置“背景颜色：
#CCCCCC”，单击“确定”，鼠标移到表格右边，选择“插入︱表单︱表单”，在页面中生成制作一个表单框。
在表单框中输
升级会员 