《网页设计与制作》（电工版第3版）期末复习卷（六）

《网页设计与制作》（电工版第3版） 期末复习卷（六）原卷版 时间：60分钟 总分：100分 班级 姓名 学号 成绩 ____________ 1、 选择题（共20题，每题2分，共40分） 1. WWW服务采用的工作模式是（　） A. 对等网模式 B. 客户机/服务器模式 C. 浏览器/服务器模式 D. 主从模式 2. 首页的文件名可以是（　） A. main.htm B. webpage.htm C. homepage.htm D. index.htm 3. 在HTML中，<title>标记中的内容将显示在（　） A. 网页正文中 B. 浏览器的标题栏上 C. 状态栏中 D. 收藏夹中 4. 在Dreamweaver中，段落标记<p>的align属性取值不包括（　） A. left B. center C. right D. middle 5. 水平线标记<hr>中，用于设置水平线为实心线的属性是（　） A. color B. size C. width D. noshade 6. 自定义列表中，用于定义上层目录的标记是（　） A. <dl> B. <dt> C. <dd> D. <li> 7. 在Dreamweaver中，打开插入面板的快捷键是（　） A. Ctrl+F2 B. Ctrl+F3 C. Shift+F4 D. F12 8. 在Dreamweaver中，要启用“允许多个连续空格”功能，应使用的菜单是（　） A. 文件 B. 编辑 C. 命令 D. 工具 9. 在CSS中，a:hover表示（　） A. 链接的默认状态 B. 已访问链接的状态 C. 鼠标指针悬停在链接上时的状态 D. 链接被单击时的状态 10. 在CSS中，设置文本颜色的属性是（　） A. font-size B. background-color C. text-align D. color 11. 在CSS盒子模型中，padding表示（　） A. 外边距 B. 内边距 C. 边框 D. 内容 12. JPEG图像格式的特点是（　） A. 支持透明背景 B. 支持动画 C. 采用有损压缩 D. 最多使用256种颜色 13. 根路径以（　）开头。 A. 协议 B. .. C. / D. // 14. 在Dreamweaver中，为文本“关闭窗口”创建脚本链接，单击后可关闭当前窗口，链接框中应输入（　） A. javascript:alert() B. javascript:window.close() C. # D. mailto: 15. 在Dreamweaver中，将光标定位到某单元格，按一次Ctrl+A组合键将选中（　） A. 整个表格 B. 当前单元格 C. 当前行 D. 当前列 16. 在Dreamweaver中，按住Shift键的同时拖动鼠标更改列的右边框线，其他列的宽度（　） A. 随之更改 B. 表格总宽度不变 C. 不会改变 D. 不确定 17. 在行为中，事件onDblClick表示（　）时触发。 A. 鼠标单击 B. 鼠标双击 C. 鼠标移动 D. 鼠标悬停 18. 在Dreamweaver中，“交换图像”行为的作用是（　） A. 交换两个图像的位置 B. 通过更改img标签的src属性将一个图像和另一个图像进行交换 C. 交换两个图像的尺寸 D. 交换两个图像的alt属性 19. 关于可编辑区域说法错误的是（ ） A. 可编辑区域名称不能使用单引号、双引号、尖括号和 “&”等符号 B. 同一模板中的多个可编辑区域可使用相同的名称 C. 不能将多个单元格标记为单个可编辑区域 D. 可将整个表格或单个单元格标记为可编辑区域 20. 在表单中，要设置<input>文本框为“必填项”，应在代码中添加（　） A. readonly="readonly" B. required="required" C. autofocus="autofocus" D. disabled="disabled" 2、 简答题（共4题，每题5分） 1. 根据所学知识回答下列问题： （1） 简述网页的定义。 （2） 简述网页的分类，以及各类网页常见的扩展名。 （3） 简述主页的定义。 2. 使用页面属性，可以进行总体网页的布局设计，根据所学内容，回答下列问题： （1） 简述背景图像“重复”的四个取值。 （2） 简述跟踪图像的含义及功能。 （3） 设置页面属性，当鼠标指向超文本时字体颜色变为红色，且取消下划线。 3. 在网页中插入图2-1所示的image文件夹中的图像文件rd.jpg，并将图中的“吃”链接到站点文件夹chi.html。 图2-1 4. 简述目标target的取值及含义。 3、 案例分析题（共4题，每题5分） 1. 表格作为网页布局最常见也是最基本的布局方式，被大多数初学者热捧，请根据所学内容，完成下列操作： （1） 小明使用嵌套表格进行布局的时候，需要注意的要求是什么？ （2） 电脑的屏幕分辨率一般为1980*1280，请问设置表格的宽度为多少的时候，可以确保不出现横向的滚动条？ （3） 小明要插入一个1行4列的表格，如下图3-1所示，在“插入表格”对话框中设置合理的是（ ） 图3-1 A. 边框为1，边距为10，间距为0 B. 边框为1，边距为0，间距为10 C. 边框为1，边距为10，间距为0 D. 边框为0，边距为0，间距为10 2. 网页index.html使用模板mb.dwt制作完成，请根据所学，完成下列问题： （1） 取消mb.dwt中的名为edit1的可编辑区域，请写出操作步骤。 （2） 将网页index.html从模板mb.dwt从分离，请写出操作步骤。 （3） 现有网页untitled1.html，将其添加到模板mb.dwt的可编辑区域edit2中。 3. 在 Dreamweaver CC 中，如图 3-2 所示表单，请根据所学知识回答以下问题。 图3-2 （1）请简述检查表单的功能。 （2）若要实现单击 “提交””按钮时检查表单，要求手机号是必需的，且为数字（手机号文本域名称为telephone）。 4. 根据提示及图3-3，补全下面的代码。 提示：网页中的图片为images文件夹中的hzyyh.jpg，“The 19th Asian Games”是从右向左滚动的文本，导航条文本应用了样式.ys001（大小15像素，行高28像素）。 图3-3 <html> <head> <title>体育世界</title> <style type="text/css"> .ys001 { font-size: 15px; _______①________ } </style></head> <body> <table width="1000" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="center"> ___________________②__________________ </td> </tr> <tr> <td height="30" align="center">_____________③_____________</td> </tr> <tr> <td height="30" align="center" _______④________> 精彩瞬间 比赛赛程 积分排名 精彩视频 新闻中心</td> </tr> </table> _______⑤________ </html> 4、 综合应用题（共2题，每题10分） 1. 根据提示，补全下面的CSS代码。 #background{ Background-image: ① ; <!--背景图片为image文件夹下的bg.jpg--> ② <!--背景图片重复方式为不重复--> ③ <!--背景图片随网页进行滚动--> ④ <!--背景图片的位置为居中显示--> ⑤ <!--整个#background块在页面中居中显示--> 2. 网页index.html已在Dreamweaver中打开，如图4-1所示，请根据要求完成下列操作： 图4-1 （1） 为网页插入背景音乐bgsound.mp3，并在网页打开后自动开始循环播放，不显示播放条。 （2） 将文字“更多>>”链接到站点文件夹下other文件夹中的fjms.html，并且网页在新的窗口打开，写出相应的html标记代码。 （3） 添加CSS样式.ys，并设置字体为黑体，行高为20px，字体大小为20px，将其应用到文字“山东旅游……尤为著名。” 原创精品资源学科网独家享有版权，侵权必究！ 学科网（北京）股份有限公司 $《网页设计与制作》（电工版第3版) 期末复习卷（六）答题卡 时间：60分钟 总分：100分 姓名 成绩 考号 一、选择题（共20题，每题2分，共40分） 1A☐BCD□6AOB☐cD]11AOB☐c□D16A□B☐CD□ 2AB□CD7A▣B□CD12AB□CD17ABC□D 3AB□CD8A▣B□CD13AB□CD18AB□C□D 4AB□CD9A幻B□CD14AB□CD19AB□C□D 5A☐B]C]D]10A☐B☐C]D]15A☐BC]D]20A☐B]C]D] 二、简答题（共4题，每题5分） 1. 2. 期末复习卷六答题卡页共4页 3. 4. 三、案例分析题（共4题，每题5分) 1. 2. 期末复习卷六题去页共4页 3. 4.①- ② ③ ④ 期末复习卷六答题卡页共4页 ⑤ 四、综合应用题（共2题，每题10分） 1.① ② ③ ④ ⑤ 2. 期末复习卷六题本页共4页 《网页设计与制作》（电工版第3版） 期末复习卷（六）解析版 时间：60分钟 总分：100分 班级 姓名 学号 成绩 ____________ 1、 选择题（共20题，每题2分，共40分） 1. WWW服务采用的工作模式是（　） A. 对等网模式 B. 客户机/服务器模式 C. 浏览器/服务器模式 D. 主从模式 【答案】B 【解析】WWW服务采用客户机/服务器工作模式 2. 首页的文件名可以是（　） A. main.htm B. webpage.htm C. homepage.htm D. index.htm 【答案】D 【解析】首页的文件名：index.htm index.html index.asp default.htm default.html default.asp 3. 在HTML中，<title>标记中的内容将显示在（　） A. 网页正文中 B. 浏览器的标题栏上 C. 状态栏中 D. 收藏夹中 【答案】B 【解析】标题标记包含的文字将出现在浏览器的标题栏上，当用户将此页面添加到收藏夹时，也会默认以该标题为名称收藏。 4. 在Dreamweaver中，段落标记<p>的align属性取值不包括（　） A. left B. center C. right D. middle 【答案】D 【解析】对齐方式align的三种取值：left（左对齐）、center（居中对齐）和right（右对齐）。 5. 水平线标记<hr>中，用于设置水平线为实心线的属性是（　） A. color B. size C. width D. noshade 【答案】D 【解析】noshade用于设置水平线为实心线。 6. 自定义列表中，用于定义上层目录的标记是（　） A. <dl> B. <dt> C. <dd> D. <li> 【答案】B 【解析】<dl>……</dl> <dt>……</dt>（列表中的上层目录） <dd>……</dd>（列表中的下层内容） 7. 在Dreamweaver中，打开插入面板的快捷键是（　） A. Ctrl+F2 B. Ctrl+F3 C. Shift+F4 D. F12 【答案】A 【解析】打开插入面板的快捷键：Ctrl+F2。 打开属性面板的快捷键：Ctrl+F3；打开行为面板：shift+F4；预览网页：F12 8. 在Dreamweaver中，要启用“允许多个连续空格”功能，应使用的菜单是（　） A. 文件 B. 编辑 C. 命令 D. 工具 【答案】B 【解析】选择菜单“编辑→首选项”命令，弹出对话框。在“分类”列表中选择“常规”选项，勾选“允许多个连续的空格”复选框，单击“确定”按钮。此时，可以直接按空格键输入空格。 9. 在CSS中，a:hover表示（　） A. 链接的默认状态 B. 已访问链接的状态 C. 鼠标指针悬停在链接上时的状态 D. 链接被单击时的状态 【答案】C 【解析】变换图像链接：指定当鼠标指针位于链接文本上时显示的颜色，对应CSS属性：a:hover 10. 在CSS中，设置文本颜色的属性是（　） A. font-size B. background-color C. text-align D. color 【答案】D 【解析】设置文本颜色：color font-size：字体大小；background-color：背景颜色； text-align：文本对齐方式。 11. 在CSS盒子模型中，padding表示（　） A. 外边距 B. 内边距 C. 边框 D. 内容 【答案】B 【解析】padding，盒子模型中的“间隙”，又称内边距。 12. JPEG图像格式的特点是（　） A. 支持透明背景 B. 支持动画 C. 采用有损压缩 D. 最多使用256种颜色 【答案】C 【解析】JPEG格式支持24位真彩色，采用有损压缩的方式。 GIF格式可以产生动画效果，且支持透明背景显示，最多只能使用256种颜色 13. 根路径以（　）开头。 A. 协议 B. .. C. / D. // 【答案】C 【解析】根路径首先以一个“/”开头，表示站点的根文件夹。 14. 在Dreamweaver中，为文本“关闭窗口”创建脚本链接，单击后可关闭当前窗口，链接框中应输入（　） A. javascript:alert() B. javascript:window.close() C. # D. mailto: 【答案】B 【解析】关闭当前窗口：javascript:window.close(); 15. 在Dreamweaver中，将光标定位到某单元格，按一次Ctrl+A组合键将选中（　） A. 整个表格 B. 当前单元格 C. 当前行 D. 当前列 【答案】B 【解析】鼠标定位到表格中某个单元格后，按一次CTRL+A，选中单元格，按2次CTRL+A，选中整个表格，按3次CTRL+A，选中整个网页。 16. 在Dreamweaver中，按住Shift键的同时拖动鼠标更改列的右边框线，其他列的宽度（　） A. 随之更改 B. 表格总宽度不变 C. 不会改变 D. 不确定 【答案】C 【解析】按住 Shift 键的同时，拖动鼠标更改列的右边框线，其他列的宽度不会改变，表格的总宽度发生改变。 17. 在行为中，事件onDblClick表示（　）时触发。 A. 鼠标单击 B. 鼠标双击 C. 鼠标移动 D. 鼠标悬停 【答案】B 【解析】onDblClick（双击鼠标）：当用户双击时，发生该事件。 18. 在Dreamweaver中，“交换图像”行为的作用是（　） A. 交换两个图像的位置 B. 通过更改img标签的src属性将一个图像和另一个图像进行交换 C. 交换两个图像的尺寸 D. 交换两个图像的alt属性 【答案】B 【解析】交换图像：通过更改“img”标签的“src”属性将一个图像和另一个图像进行交换。 19. 关于可编辑区域说法错误的是（ ） A. 可编辑区域名称不能使用单引号、双引号、尖括号和 “&” 等符号 B. 同一模板中的多个可编辑区域可使用相同的名称 C. 不能将多个单元格标记为单个可编辑区域 D. 可将整个表格或单个单元格标记为可编辑区域 【答案】B 【解析】可编辑区域命名规则： （1）命名一个可编辑区域时，不能使用单引号、双引号、尖括号和“&”等符号。 （2）不能对同一模板中的多个可编辑区域使用相同的名称。 （3）可将整个表格或单个单元格标记为可编辑区域，但不能将多个单元格标记为单个可编辑区域。 （4）可编辑区域不能嵌套插入。 20. 在表单中，要设置<input>文本框为“必填项”，应在代码中添加（　） A. readonly="readonly" B. required="required" C. autofocus="autofocus" D. disabled="disabled" 【答案】B 【解析】required：浏览器检查是否已选定值（设置“必选项”） read only：使浏览器无法更改文本区域（设置“只读”） auto focus：浏览器被打开时自动获得焦点 disabled：使浏览器禁用元素 2、 简答题（共4题，每题5分） 1. 根据所学知识回答下列问题： （1） 简述网页的定义。 （2） 简述网页的分类，以及各类网页常见的扩展名。 （3） 简述主页的定义。 【答案】 （1）网页是构成网站的基本元素，一般又称作HTML文档，是一种可以在互联网上传输，能被浏览器识别和翻译成页面并显示出来的文件。（2分） （2）静态网页扩展名： .htm 或 .html （1分） 动态网页扩展名：.asp、 .php、 .jsp等（1分） （3）在浏览器的地址栏中输入网站的URL（统一资源定位符，也称为网址）后见到的第一个网页称为网站的主页，也称为首页。主页是网站中所有网页的索引页。（1分） 2. 使用页面属性，可以进行总体网页的布局设计，根据所学内容，回答下列问题： （1） 简述背景图像“重复”的四个取值。 （2） 简述跟踪图像的含义及功能。 （3） 设置页面属性，当鼠标指向超文本时字体颜色变为红色，且取消下划线。 【答案】 （1） No-repeat（不重复），repeat-x（横向重复），repeat-y（纵向重复），repeat（重复）（2分） （2） 跟踪图像允许用户在网页中将原来的平面设计稿作为辅助背景，可精确的定位页面元素。（1分） （3） ①选择菜单“文件”→“页面属性”命令打开页面属性对话框； ②在链接（CSS）类别中，设置变换图像链接为#FF0000，下划线样式为“始终无下划线”点击“确定”。（2分） 3. 在网页中插入图2-1所示的image文件夹中的图像文件rd.jpg，并将图中的“吃”链接到站点文件夹chi.html。 图2-1 【答案】 ①将光标定位到需要插入图像的位置选择菜单“插入→Image”命令，打开“选择图像源文件”对话框，在image文件夹中选择图像文件rd.jpg，单击“确定”按钮；（2分） ②在属性面板上选择圆形热点工具，在图像上“吃”字创建相应形状的热点；（2分） ③在“热点”属性面板中链接文本框输入chi.html。（1分） 4. 简述目标target的取值及含义。 【答案】（每条1分，共5分） _blank:将链接的文档在一个未命名的新浏览器窗口中打开，原来打开的窗口不变。 _new:将链接的文档始终在同一个新的浏览器窗口中打开。 _parent:将链接的文档在该链接所在框架的父级框架或父级窗口中打开。如果包含链接的框架不是嵌套框架，则所链接的文件会载入整个浏览器窗口。 _self:将链接的文档在当前浏览器窗口中打开。该打开方式是系统默认项。 _top:将链接的文档在整个浏览器窗口中打开，会删除所有框架。 3、 案例分析题（共4题，每题5分） 1. 表格作为网页布局最常见也是最基本的布局方式，被大多数初学者热捧，请根据所学内容，完成下列操作： （1） 小明使用嵌套表格进行布局的时候，需要注意的要求是什么？ （2） 电脑的屏幕分辨率一般为1980*1280，请问设置表格的宽度为多少的时候，可以确保不出现横向的滚动条？ （3） 小明要插入一个1行4列的表格，如下图3-1所示，在“插入表格”对话框中设置合理的是（ ） 图3-1 A. 边框为1，边距为10，间距为0 B. 边框为1，边距为0，间距为10 C. 边框为1，边距为10，间距为0 D. 边框为0，边距为0，间距为10 【答案】 （1）①整个网页不要放在一个表格里，尽量使用多个表格来进行布局。 ②表格的嵌套层次尽量要少。 ③单一表格的结构尽量整齐，不要太复杂。（任意2条即可，2分） （2）1958px（1分） （3）B（2分） 2. 网页index.html使用模板mb.dwt制作完成，请根据所学，完成下列问题： （1） 取消mb.dwt中的名为edit1的可编辑区域，请写出操作步骤。 （2） 将网页index.html从模板mb.dwt从分离，请写出操作步骤。 （3） 现有网页untitled1.html，将其添加到模板mb.dwt的可编辑区域edit2中。 【答案】 （1）在模板文档中，选择要取消的可编辑区域edit1，“工具”→“模板”→“删除模板标记”命令。（1分） （2）打开网页index.html，执行“工具”→“模板”→“从模板中分离”命令。（1分） （3）①打开网页untitled1.html，选择“工具→模板→应用模板到页”命令，弹出“选择模板”对话框，从模板列表中选择模板mb.dwt，单击“选定”按钮。（1分） ②选择“Document body<未解析>”，在“将内容移到新区域”列表中选择要移动到的可编辑区域名称edit2。（1分） ③选择“Document head<未解析>”，在“将内容移到新区域”列表中选择“head”。（1分） 3. 在 Dreamweaver CC 中，如图 3-2 所示表单，请根据所学知识回答以下问题。 图3-2 （1）请简述检查表单的功能。 （2）若要实现单击 “提交” 按钮时检查表单，要求手机号是必需的，且为数字（手机号文本域名称为telephone）。 【答案】 （1） 可以为表单中各元素设置有效性规则，并检查指定文本域的内容以确保用户输入正确的数据类型，防止表单提交到服务器后，文本域中包含无效的数据。（2分） （2） ①选中“提交”按钮，窗口→行为，打开行为面板； ②点击“+”添加行为按钮，在下拉菜单中选择“检查表单”，弹出“检查表单”对话框； ③选择“手机号”所对应的字段名telephone，勾选“必需的”；（1分） ④在“可接收”区域勾选“数字”，点击“确定”；（1分） ⑤设置“检查表单”的事件为onclick。（1分） 4. 根据提示及图3-3，补全下面的代码。 提示：网页中的图片为images文件夹中的hzyyh.jpg，“The 19th Asian Games”是从右向左滚动的文本，导航条文本应用了样式.ys001（大小15像素，行高28像素）。 图3-3 <html> <head> <title>体育世界</title> <style type="text/css"> .ys001 { font-size: 15px; _______①________ } </style></head> <body> <table width="1000" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="center"> ___________________②__________________ </td> </tr> <tr> <td height="30" align="center">_____________③_____________</td> </tr> <tr> <td height="30" align="center" _______④________> 精彩瞬间 比赛赛程 积分排名 精彩视频 新闻中心</td> </tr> </table> _______⑤________ </html> 【答案】（每空1分，共5分） ①line-height:28px; ②<img src=”images/hzyyh.jpg”> ③<marquee> The 19th Asian Games </marquee> ④class=”ys001” ⑤</body> 4、 综合应用题（共2题，每题10分） 1. 根据提示，补全下面的CSS代码。 #background{ Background-image: ① ; <!--背景图片为image文件夹下的bg.jpg--> ② <!--背景图片重复方式为不重复--> ③ <!--背景图片随网页进行滚动--> ④ <!--背景图片的位置为居中显示--> ⑤ <!--整个#background块在页面中居中显示--> 【答案】（每空2分，共10分） ①url(“image/bg.jpg”) ②background-repeat:no-repeat; ③background-attachment:scroll; ④background-position:center center; ⑤margin:0 auto; 2. 网页index.html已在Dreamweaver中打开，如图4-1所示，请根据要求完成下列操作： 图4-1 （1） 为网页插入背景音乐bgsound.mp3，并在网页打开后自动开始循环播放，不显示播放条。 （2） 将文字“更多>>”链接到站点文件夹下other文件夹中的fjms.html，并且网页在新的窗口打开，写出相应的html标记代码。 （3） 添加CSS样式.ys，并设置字体为黑体，行高为20px，字体大小为20px，将其应用到文字“山东旅游……尤为著名。” 【答案】 （1）①将光标定位到要插入音频文件的位置，选择菜单“插入→HTML→插件”命令，在打开的“选择文件”对话框中选择音频文件bgsound.mp3，点击确定。（1分） ②选择音频插件占位符，在属性面板中单击“参数”按钮，打开“参数”对话框，在“参数”框中输入“hidden”，并设定值为“true” ，单击加号按钮 ，在新出现的行中输入“autostart”，并设定值为“true”，单击“确定”按钮。（2分） ③进入代码视图，在生成的<embed>中输入loop=”-1”。（1分） （2）<a href=”other/fjms.html” target=”_blank”>更多&gt;&gt;</a>（2分） （3）①打开CSS设计器面板，单击“添加新的CSS源”，选择“在页面中定义”；（1分） ②选中“源”中自动生成的“<style>”，在CSS设计器面板单击“添加选择器”按钮，输入样式名.ys，单击“添加CSS属性”，设置CSS属性font-family为黑体，line-height为20px，font-size为20px；（2分） ③选中文字“山东旅游……尤为著名。”，在属性面板的“类”中选择“ys”。（1分） 原创精品资源学科网独家享有版权，侵权必究！ 学科网（北京）股份有限公司 $